studiocms 0.2.0 → 0.4.0

package/frontend/middleware/index.ts

@@ -12,23 +12,55 @@
 
 import crypto from 'node:crypto';
 import { User, VerifyEmail } from 'studiocms:auth/lib';
-import { dashboardConfig } from 'studiocms:config';
+import config, { dashboardConfig } from 'studiocms:config';
 import { defaultLang } from 'studiocms:i18n';
 import { StudioCMSRoutes } from 'studiocms:lib';
 import { SDKCore } from 'studiocms:sdk';
 import SCMSUiVersion from 'studiocms:ui/version';
 import SCMSVersion from 'studiocms:version';
-import { defineMiddlewareRouter, Effect } from '@withstudiocms/effect';
-import micromatch from 'micromatch';
+import {
+	Config,
+	defineDataMiddleware,
+	defineMiddlewareRouter,
+	Effect,
+	Layer,
+	Logger,
+	type LogLevel,
+	MiddlewareError,
+	Schema,
+} from '@withstudiocms/effect';
 import { STUDIOCMS_EDITOR_CSRF_COOKIE_NAME } from '#consts';
-import { authenticatedRoutes } from './_authmap.js';
 import { getUserPermissions, makeFallbackSiteConfig, SetLocal, setLocals } from './utils.js';
 
+// Load the log level from the configuration and apply it as a layer
+const LogLevelLive = Config.withDefault(
+	Config.logLevel('STUDIOCMS_LOGLEVEL'),
+	config.logLevel
+).pipe(
+	Effect.tap((level) => Effect.log(`StudioCMS Middleware Log Level set to: ${level}`)),
+	Effect.andThen((level) =>
+		// Set the minimum log level
+		Logger.minimumLogLevel(level as LogLevel.LogLevel)
+	),
+	Layer.unwrapEffect, // Convert the effect into a layer
+	Layer.provide(Logger.pretty) // Ensure that the Logger.pretty layer is included
+);
+
 // Import the dashboard route override from the configuration
 // If no override is set, it defaults to 'dashboard'
 // This allows for flexibility in the dashboard route without hardcoding it
 const dashboardRoute = dashboardConfig.dashboardRouteOverride || 'dashboard';
 
+/**
+ * Helper function to create a standard 200 OK response.
+ *
+ * This function is used to return a successful response from the middleware when access is granted.
+ * It simplifies the response creation process and ensures consistency across the middleware handlers.
+ *
+ * @returns A Response object with a 200 OK status.
+ */
+const okResponse = () => new Response(null, { status: 200 });
+
 /**
  * Main middleware sequence for StudioCMS.
  *
@@ -114,12 +146,6 @@ export const onRequest = defineMiddlewareRouter([
 		}),
 	},
 	{
-		/**
-		 * Middleware function to handle user authentication for the dashboard.
-		 * This middleware checks if the user is logged in and redirects to the login page if not
-		 * authenticated. It also excludes certain paths from this check, such as login, signup,
-		 * logout, and forgot password routes.
-		 */
 		includePaths: [`/${dashboardRoute}/**`],
 		excludePaths: [
 			`/${dashboardRoute}/login`,
@@ -134,66 +160,81 @@ export const onRequest = defineMiddlewareRouter([
 			`/${dashboardRoute}/password-reset/**`,
 		],
 		priority: 3,
-		handler: Effect.fn(function* (context, next) {
-			const getUserData = yield* Effect.gen(function* () {
-				const { getUserData } = yield* User;
-				return getUserData;
-			});
+		handler: defineDataMiddleware(
+			Schema.Struct({
+				'x-required-role': Schema.optional(
+					Schema.Literal('owner', 'admin', 'editor', 'visitor', 'none')
+				),
+				'x-redirect-url': Schema.optional(Schema.String),
+			}),
+			Effect.fn(
+				function* (context, data) {
+					const getUserData = (yield* User).getUserData;
 
-			// Retrieve the user session data from the context locals or fetch it
-			const userSessionData =
-				context.locals.StudioCMS.security?.userSessionData ?? (yield* getUserData(context));
+					yield* Effect.logDebug('Data middleware received headers:', data);
 
-			// Check if the user is logged in and redirect to the login page if not
-			if (!userSessionData.isLoggedIn) return context.redirect(StudioCMSRoutes.authLinks.loginURL);
+					// Get the required role from the headers, defaulting to 'none' if not provided
+					// This is an 'Opt-in' Middleware
+					const requiredRole = data['x-required-role'] ?? 'none';
+					const redirectUrl = data['x-redirect-url'] ?? `/${dashboardRoute}`;
 
-			// Get the current path
-			const currentPath = context.url.pathname;
+					// If the required role is 'none', allow access without checking user data
+					if (requiredRole === 'none') {
+						yield* Effect.logDebug(
+							'No required role specified, allowing access without authentication'
+						);
+						return okResponse();
+					}
 
-			// Check if the user has permission to access the current route
-			// If not, redirect to the dashboard home page
-			const userPermissionLevel =
-				context.locals.StudioCMS.security?.userSessionData.permissionLevel;
+					// Retrieve the user session data from the context locals or fetch it
+					const userSessionData =
+						context.locals.StudioCMS.security?.userSessionData ?? (yield* getUserData(context));
 
-			if (!userPermissionLevel) {
-				// How did the user get here? Log them out to reset session
-				return context.redirect(`/${dashboardRoute}/logout`);
-			}
+					if (!userSessionData.isLoggedIn) {
+						yield* Effect.logDebug('User is not logged in, redirecting to login page');
+						return context.redirect(StudioCMSRoutes.authLinks.loginURL);
+					}
+
+					yield* Effect.logDebug(
+						'User is logged in, checking permissions for required role:',
+						requiredRole
+					);
 
-			// Using micromatch to handle wildcard route matching
-			const matchChance1 = authenticatedRoutes.find((route) =>
-				micromatch.isMatch(currentPath, route.pathname)
-			);
-
-			// if trailing `/` exists, try matching without it
-			const matchChance2 =
-				matchChance1 ||
-				(() => {
-					if (currentPath.endsWith('/')) {
-						const trimmedPath = currentPath.slice(0, -1);
-						return authenticatedRoutes.find((route) =>
-							micromatch.isMatch(trimmedPath, route.pathname)
+					const userPermissionLevel = userSessionData.permissionLevel;
+
+					if (!userPermissionLevel) {
+						yield* Effect.logDebug(
+							'User permission level is missing, redirecting to logout to reset session'
 						);
+						// How did the user get here? Log them out to reset session
+						return context.redirect(`/${dashboardRoute}/logout`);
 					}
-					return null;
-				})();
-
-			if (matchChance1 || matchChance2) {
-				// biome-ignore lint/style/noNonNullAssertion: only used after checking for existence
-				const matchingRoute = matchChance1 || matchChance2!;
-				const requiredLevel = matchingRoute.requiredPermissionLevel;
-				const levels = ['visitor', 'editor', 'admin', 'owner'];
-				const userLevelIndex = levels.indexOf(userPermissionLevel);
-				const requiredLevelIndex = levels.indexOf(requiredLevel);
-
-				if (userLevelIndex < requiredLevelIndex) {
-					return context.redirect(`/${dashboardRoute}`);
-				}
-			}
 
-			// Else, Continue to the next middleware
-			return next();
-		}),
+					yield* Effect.logDebug(
+						`User permission level: ${userPermissionLevel}, required role: ${requiredRole}`
+					);
+
+					const levels = ['visitor', 'editor', 'admin', 'owner'];
+					const userLevelIndex = levels.indexOf(userPermissionLevel);
+					const requiredLevelIndex = levels.indexOf(requiredRole);
+
+					if (userLevelIndex < requiredLevelIndex) {
+						yield* Effect.logDebug(
+							`User does not have required permissions (user level: ${userPermissionLevel}, required level: ${requiredRole}), redirecting to:`,
+							redirectUrl
+						);
+						return context.redirect(redirectUrl);
+					}
+
+					yield* Effect.logDebug('User has required permissions, allowing access');
+					return okResponse();
+				},
+				Effect.provide(LogLevelLive),
+				Effect.catchAll(
+					(cause) => new MiddlewareError({ message: 'Failed to get user data', cause })
+				)
+			)
+		),
 	},
 	{
 		/**

package/frontend/pages/404.astro

@@ -1,25 +1,21 @@
 ---
+import { config } from 'studiocms:config';
 import '../styles/404.css';
 import { useTranslations } from 'studiocms:i18n';
 import { Button } from 'studiocms:ui/components/button';
 import Layout from '../layouts/DashboardLayout.astro';
 
-const lang = Astro.locals.StudioCMS.defaultLang;
+const lang = config.locale.i18n.defaultLocale;
 const t = useTranslations(lang, '@studiocms/dashboard:404');
-
-const { siteConfig: config, security } = Astro.locals.StudioCMS;
-
-const currentUser = security?.userSessionData ?? null;
 ---
 
 <Layout 
   title={t('title')}
   description={t('description')}
   sidebar={false} 
-  requiredPermission="none"
-  {lang}
-  {config}
-  {currentUser}>
+  config={{ data: { title: t('title'), description: t('description') }, id: ''  }}
+  currentUser={null}
+  {lang}>
   <div class="notfound-container">
     <div class="notfound">
       <svg viewBox="0 0 755 792" fill="none" xmlns="http://www.w3.org/2000/svg">

package/frontend/pages/[dashboard]/[...pluginPage].astro

@@ -1,5 +1,6 @@
 ---
 import { getPluginDashboardPages } from 'studiocms:plugin-helpers';
+import { setDataContext } from '@withstudiocms/effect/astro/data-middleware';
 import type { FinalDashboardPage } from '#schemas';
 import PageHeader from '../../components/dashboard/PageHeader.astro';
 import Layout from '../../layouts/DashboardLayout.astro';
@@ -43,12 +44,20 @@ const {
 
 // Check if the sidebar is double and if the InnerSidebarComponent exists to determine the sidebar configuration
 const sidebarConfig = sidebar === 'double' && InnerSidebarComponent ? 'double' : 'single';
+
+setDataContext(Astro, {
+	key: 'x-required-role',
+	value: requiredPermissions,
+});
+setDataContext(Astro, {
+	key: 'x-redirect-url',
+	value: Astro.locals.StudioCMS.routeMap.mainLinks.dashboardIndex,
+});
 ---
 
 <Layout 
   title={title[lang]}
   description={description}
-  requiredPermission={requiredPermissions}
   sidebar={sidebarConfig}
   {lang}
   {config}

package/frontend/pages/[dashboard]/configuration.astro

@@ -2,6 +2,7 @@
 import { useTranslations } from 'studiocms:i18n';
 import { Button } from 'studiocms:ui/components/button';
 import { Icon } from 'studiocms:ui/components/icon';
+import { setDataContext } from '@withstudiocms/effect/astro/data-middleware';
 import BrowserInputArray from '#frontend/components/shared/storage-manager/BrowserInputArray.astro';
 import ConfigForm from '../../components/dashboard/configuration/ConfigForm.astro';
 import PageHeader from '../../components/dashboard/PageHeader.astro';
@@ -12,12 +13,20 @@ const { siteConfig: config, defaultLang: lang, security } = Astro.locals.StudioC
 const currentUser = security?.userSessionData ?? null;
 
 const t = useTranslations(lang, '@studiocms/dashboard:configuration');
+
+setDataContext(Astro, {
+	key: 'x-required-role',
+	value: 'owner',
+});
+setDataContext(Astro, {
+	key: 'x-redirect-url',
+	value: Astro.locals.StudioCMS.routeMap.mainLinks.dashboardIndex,
+});
 ---
 
 <Layout 
   title={t('title')}
   description={t('description')}
-  requiredPermission='owner'
   {lang}
   {config}
   {currentUser}

package/frontend/pages/[dashboard]/content-management/createfolder.astro

@@ -1,5 +1,6 @@
 ---
 import { useTranslations } from 'studiocms:i18n';
+import { setDataContext } from '@withstudiocms/effect/astro/data-middleware';
 import CreateFolder from '../../../components/dashboard/content-mgmt/CreateFolder.astro';
 import InnerSidebarElement from '../../../components/dashboard/content-mgmt/InnerSidebarElement.astro';
 import PageHeader from '../../../components/dashboard/content-mgmt/PageHeader.astro';
@@ -10,12 +11,20 @@ const { siteConfig: config, defaultLang: lang, security } = Astro.locals.StudioC
 const currentUser = security?.userSessionData ?? null;
 
 const t = useTranslations(lang, '@studiocms/dashboard:content-index');
+
+setDataContext(Astro, {
+	key: 'x-required-role',
+	value: 'editor',
+});
+setDataContext(Astro, {
+	key: 'x-redirect-url',
+	value: Astro.locals.StudioCMS.routeMap.mainLinks.dashboardIndex,
+});
 ---
 
 <Layout 
   title={t('title')}
   description={t('description')}
-  requiredPermission='editor'
   sidebar='double'
   {lang}
   {config}

package/frontend/pages/[dashboard]/content-management/createpage.astro

@@ -1,5 +1,6 @@
 ---
 import { useTranslations } from 'studiocms:i18n';
+import { setDataContext } from '@withstudiocms/effect/astro/data-middleware';
 import BrowserInputArray from '#frontend/components/shared/storage-manager/BrowserInputArray.astro';
 import CreatePage from '../../../components/dashboard/content-mgmt/CreatePage.astro';
 import InnerSidebarElement from '../../../components/dashboard/content-mgmt/InnerSidebarElement.astro';
@@ -11,12 +12,20 @@ const { siteConfig: config, defaultLang: lang, security } = Astro.locals.StudioC
 const currentUser = security?.userSessionData ?? null;
 
 const t = useTranslations(lang, '@studiocms/dashboard:content-index');
+
+setDataContext(Astro, {
+	key: 'x-required-role',
+	value: 'editor',
+});
+setDataContext(Astro, {
+	key: 'x-redirect-url',
+	value: Astro.locals.StudioCMS.routeMap.mainLinks.dashboardIndex,
+});
 ---
 
 <Layout 
   title={t('title')}
   description={t('description')}
-  requiredPermission='editor'
   sidebar='double'
   {lang}
   {config}

package/frontend/pages/[dashboard]/content-management/diff.astro

@@ -7,6 +7,7 @@ import { Card } from 'studiocms:ui/components/card';
 import { Group } from 'studiocms:ui/components/group';
 import { Input } from 'studiocms:ui/components/input';
 import { Effect, genLogger, runEffect } from '@withstudiocms/effect';
+import { setDataContext } from '@withstudiocms/effect/astro/data-middleware';
 import InnerSidebarElement from '../../../components/dashboard/content-mgmt/InnerSidebarElement.astro';
 import PageHeader from '../../../components/dashboard/content-mgmt/PageHeader.astro';
 import Layout from '../../../layouts/DashboardLayout.astro';
@@ -52,12 +53,20 @@ const [page, metaDataChanges, diffContentHTML] = await runEffect(
 );
 
 if (!page) return new Response(null, { status: 404 });
+
+setDataContext(Astro, {
+	key: 'x-required-role',
+	value: 'editor',
+});
+setDataContext(Astro, {
+	key: 'x-redirect-url',
+	value: Astro.locals.StudioCMS.routeMap.mainLinks.dashboardIndex,
+});
 ---
 
 <Layout
   title={t("title")}
   description={t("description")}
-  requiredPermission="editor"
   sidebar="double"
   {lang}
   {config}
@@ -180,6 +189,8 @@ if (!page) return new Response(null, { status: 404 });
 
 <script>
   import { toast } from "studiocms:ui/components/toaster/client";
+  import { dashboardClient, dashboardSharedCatchTags } from "studiocms:client/apiClients";
+  import * as Effect from "effect/Effect";
 
   const revertMetaData = document.getElementById(
     "revert-metadata",
@@ -206,29 +217,43 @@ if (!page) return new Response(null, { status: 404 });
       return;
     }
 
-    const response = await fetch(url, {
-      headers: {
-        "Content-Type": "application/json",
-      },
-      method: "POST",
-      body: JSON.stringify({ id, type }),
-    });
-
-    const res = await response.json();
+    function isAllowedType(type: string): type is "data" | "content" | "both" {
+      return ["data", "content", "both"].includes(type);
+    }
 
-    if (response.status !== 200) {
+    if (!isAllowedType(type)) {
       toast({
         title: "Error",
-        description: res.error,
+        description: "Invalid revert type.",
         type: "danger",
       });
       return;
     }
 
-    if (response.status === 200) {
+    const response = await dashboardClient.pipe(
+      Effect.flatMap((client) => 
+        client.content.revertToDiff({
+          payload: {
+            id,
+            type,
+          }
+        })
+      ),
+      Effect.catchTags(dashboardSharedCatchTags),
+      Effect.runPromise
+    );
+
+    if ("error" in response) {
+      toast({
+        title: "Error",
+        description: response.error,
+        type: "danger",
+      });
+      return;
+    } else {
       toast({
         title: "Success",
-        description: res.message,
+        description: "Changes have been reverted successfully.",
         type: "success",
       });
       return;

package/frontend/pages/[dashboard]/content-management/editfolder.astro

@@ -2,6 +2,7 @@
 import { useTranslations } from 'studiocms:i18n';
 import { runSDK, SDKCoreJs } from 'studiocms:sdk';
 import { Effect } from '@withstudiocms/effect';
+import { setDataContext } from '@withstudiocms/effect/astro/data-middleware';
 import EditFolder from '../../../components/dashboard/content-mgmt/EditFolder.astro';
 import InnerSidebarElement from '../../../components/dashboard/content-mgmt/InnerSidebarElement.astro';
 import PageHeader from '../../../components/dashboard/content-mgmt/PageHeader.astro';
@@ -24,12 +25,20 @@ if (!currentFolder) {
 	console.warn(`Folder with ID ${editId} not found.`);
 	return new Response(null, { status: 404 });
 }
+
+setDataContext(Astro, {
+	key: 'x-required-role',
+	value: 'editor',
+});
+setDataContext(Astro, {
+	key: 'x-redirect-url',
+	value: Astro.locals.StudioCMS.routeMap.mainLinks.dashboardIndex,
+});
 ---
 
 <Layout 
   title={t('title')}
   description={t('description')}
-  requiredPermission='editor'
   sidebar='double'
   {lang}
   {config}

package/frontend/pages/[dashboard]/content-management/editpage.astro

@@ -2,6 +2,7 @@
 import { getRegistryComponents } from 'studiocms:component-registry/runtime';
 import { useTranslations } from 'studiocms:i18n';
 import { runSDK, SDKCoreJs } from 'studiocms:sdk';
+import { setDataContext } from '@withstudiocms/effect/astro/data-middleware';
 import { Effect } from 'effect';
 import ComponentRegistryUI from '#frontend/components/shared/ComponentRegistryUI.astro';
 import BrowserCopyOutput from '#frontend/components/shared/storage-manager/BrowserCopyOutput.astro';
@@ -31,12 +32,20 @@ const [pageData, users, folderList, categories, tags] = await runSDK(
 		SDKCoreJs.GET.tags.getAll(),
 	])
 );
+
+setDataContext(Astro, {
+	key: 'x-required-role',
+	value: 'editor',
+});
+setDataContext(Astro, {
+	key: 'x-redirect-url',
+	value: Astro.locals.StudioCMS.routeMap.mainLinks.dashboardIndex,
+});
 ---
 
 <Layout 
   title={t('title')}
   description={t('description')}
-  requiredPermission='editor'
   sidebar='double'
   {lang}
   {config}

package/frontend/pages/[dashboard]/content-management/index.astro

@@ -1,5 +1,6 @@
 ---
 import { useTranslations } from 'studiocms:i18n';
+import { setDataContext } from '@withstudiocms/effect/astro/data-middleware';
 import InnerSidebarElement from '../../../components/dashboard/content-mgmt/InnerSidebarElement.astro';
 import PageHeader from '../../../components/dashboard/content-mgmt/PageHeader.astro';
 import Layout from '../../../layouts/DashboardLayout.astro';
@@ -9,12 +10,20 @@ const { siteConfig: config, defaultLang: lang, security } = Astro.locals.StudioC
 const currentUser = security?.userSessionData ?? null;
 
 const t = useTranslations(lang, '@studiocms/dashboard:content-index');
+
+setDataContext(Astro, {
+	key: 'x-required-role',
+	value: 'editor',
+});
+setDataContext(Astro, {
+	key: 'x-redirect-url',
+	value: Astro.locals.StudioCMS.routeMap.mainLinks.dashboardIndex,
+});
 ---
 
 <Layout 
   title={t('title')}
   description={t('description')}
-  requiredPermission='editor'
   sidebar='double'
   {lang}
   {config}

package/frontend/pages/[dashboard]/index.astro

@@ -1,5 +1,6 @@
 ---
 import { useTranslations } from 'studiocms:i18n';
+import { setDataContext } from '@withstudiocms/effect/astro/data-middleware';
 import DashboardGrid from '../../components/dashboard/DashboardGrid.astro';
 import DashboardPageHeader from '../../components/dashboard/DashboardPageHeader.astro';
 import Layout from '../../layouts/DashboardLayout.astro';
@@ -9,12 +10,20 @@ const { siteConfig: config, defaultLang: lang, security } = Astro.locals.StudioC
 const currentUser = security?.userSessionData ?? null;
 
 const t = useTranslations(lang, '@studiocms/dashboard:index');
+
+setDataContext(Astro, {
+	key: 'x-required-role',
+	value: 'editor',
+});
+setDataContext(Astro, {
+	key: 'x-redirect-url',
+	value: Astro.locals.StudioCMS.routeMap.mainLinks.userProfile,
+});
 ---
 
 <Layout 
   title={t('title')}
   description={t('description')}
-  requiredPermission='editor'
   {lang}
   {config}
   {currentUser}