studiocms 0.2.0 → 0.4.0

package/frontend/pages/[dashboard]/user-management/edit.astro

@@ -1,4 +1,5 @@
 ---
+import { User } from 'studiocms:auth/lib';
 import { FormattedDate } from 'studiocms:components';
 import { useTranslations } from 'studiocms:i18n';
 import { SDKCore } from 'studiocms:sdk';
@@ -11,9 +12,9 @@ import { Input } from 'studiocms:ui/components/input';
 import { Modal } from 'studiocms:ui/components/modal';
 import { Select } from 'studiocms:ui/components/select';
 import { Effect, genLogger, runEffect } from '@withstudiocms/effect';
+import { setDataContext } from '@withstudiocms/effect/astro/data-middleware';
 import PageHeader from '../../../components/dashboard/PageHeader.astro';
 import InnerSidebarElement from '../../../components/dashboard/user-mgmt/InnerSidebarElement.astro';
-import RankCheck from '../../../components/dashboard/user-mgmt/RankCheck.astro';
 import SocialSignin from '../../../components/dashboard/user-mgmt/SocialSignin.astro';
 import { providerData, showOAuth } from '../../../components/shared/oAuthButtonProviders.js';
 import Layout from '../../../layouts/DashboardLayout.astro';
@@ -62,20 +63,35 @@ const disableDelete = user?.permissionsData?.rank === 'owner' || user?.id === us
 if (isOwner) allowedRanks.unshift({ label: 'Owner', value: 'owner' });
 
 if (isAdmin) allowedRanks.unshift({ label: 'Administrator', value: 'admin' });
+
+const isAuthorized = await Effect.runPromise(
+	Effect.gen(function* () {
+		const { isUserAllowed } = yield* User;
+		return yield* isUserAllowed(userSession, user?.permissionsData?.rank ?? 'unknown');
+	})
+);
+
+if (!isAuthorized) {
+	return Astro.redirect(Astro.locals.StudioCMS.routeMap.mainLinks.userManagement);
+}
+
+setDataContext(Astro, {
+	key: 'x-required-role',
+	value: 'admin',
+});
+setDataContext(Astro, {
+	key: 'x-redirect-url',
+	value: Astro.locals.StudioCMS.routeMap.mainLinks.dashboardIndex,
+});
 ---
 <Layout
   title={t('title')}
   description={t('description')}
-  requiredPermission='admin'
   sidebar='double'
   {lang}
   {config}
   currentUser={userSession}
   >
-  {/*
-    Check if the user has the required permission to manage the user's rank level
-  */}
-  <RankCheck requiredPermission={user?.permissionsData?.rank} />
 
   <div slot="double-sidebar" class="inner-sidebar-container">
     <div class="sidebar-user-links-container">
@@ -325,27 +341,22 @@ if (isAdmin) allowedRanks.unshift({ label: 'Administrator', value: 'admin' });
   <script>
     import { toast } from 'studiocms:ui/components/toaster/client';
     import { ModalHelper } from 'studiocms:ui/components/modal/client';
+    import { dashboardClient, dashboardSharedCatchTags } from 'studiocms:client/apiClients';
+    import * as Effect from 'effect/Effect';
+    import { availablePermissionRanks, type AvailablePermissionRanks } from '@withstudiocms/auth-kit/types';
 
     const resetLinkModal = new ModalHelper('password-reset-link-modal');
 
     const deleteButtons = document.querySelectorAll('[data-token]') as NodeListOf<HTMLButtonElement>;
 
-    const tokenAPILinks = document.getElementById('token-api-links') as HTMLDivElement;
-
-    const tokenAPI = tokenAPILinks.dataset.token_api!;
-
     const editUserForm = document.getElementById('edit-user-form') as HTMLFormElement;
 
-    const deleteUserAction = (document.getElementById('delete-user-modal-trigger') as HTMLButtonElement).dataset.action;
-
     const userDeleteModal = new ModalHelper('delete-user-modal', 'delete-user-modal-trigger');
 
     const passwordResetLinkTrigger = document.getElementById('password-reset-link-trigger') as HTMLButtonElement;
     const resetLinkPlaceholder = document.getElementById('reset-link-placeholder') as HTMLElement;
 
-    const resetLinkAPI = (document.getElementById('reset-link-selector') as HTMLDivElement).dataset.link;
     const userId = (document.getElementById('reset-link-selector') as HTMLDivElement).dataset.userid;
-    const dashboardIndex = (document.getElementById('reset-link-selector') as HTMLDivElement).dataset.dashboard;
 
     const passwordResetUrl = (document.getElementById('reset-link-selector') as HTMLDivElement).dataset.reseturl;
 
@@ -360,27 +371,44 @@ if (isAdmin) allowedRanks.unshift({ label: 'Administrator', value: 'admin' });
     passwordResetLinkTrigger.addEventListener('click', async (e) => {
       e.preventDefault();
 
-      const apiRes = await fetch(resetLinkAPI!, {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify({ userId: userId })
-      });
-
-      const token = await apiRes.json();
-
-      if (!apiRes.ok) {
-        console.error('Failed to create reset link');
+      if (!userId) {
         toast({
           title: 'Error',
-          description: token.error,
+          description: 'User ID is missing. Cannot generate password reset link.',
           type: 'danger'
         })
         return;
       }
 
-      resetLinkPlaceholder.innerText = generateResetLink(token);
+      const response = await dashboardClient.pipe(
+        Effect.flatMap((client) => 
+          client.create.createPasswordResetLink({
+            payload: {
+              userId
+            }
+          })
+        ),
+        Effect.catchTags(dashboardSharedCatchTags),
+        Effect.runPromise
+      )
+
+      if ('error' in response) {
+        toast({
+          title: 'Error',
+          description: response.error,
+          type: 'danger',
+        });
+        return;
+      } else if (!response) {
+        toast({
+          title: 'Error',
+          description: 'Failed to generate password reset link.',
+          type: 'danger',
+        });
+        return;
+      }
+
+      resetLinkPlaceholder.innerText = generateResetLink(response);
 
       resetLinkModal.show();
     })
@@ -391,36 +419,55 @@ if (isAdmin) allowedRanks.unshift({ label: 'Administrator', value: 'admin' });
         return
       };
 
-      const data = {
-        userId: formData.get('user-id')?.toString(),
-        username: formData.get('user-username')?.toString(),
-        usernameConfirm: formData.get('confirm-user-username')?.toString()
-      }
+      const userId = formData.get('user-id')?.toString();
+      const username = formData.get('user-username')?.toString();
+      const usernameConfirm = formData.get('confirm-user-username')?.toString();
 
-      const response = await fetch(deleteUserAction!, {
-        method: 'DELETE',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify(data)
-      })
-
-      const res = await response.json();
+      if (!userId || !username || !usernameConfirm) {
+        toast({
+          title: 'Error',
+          description: 'Missing necessary data to delete user.',
+          type: 'danger'
+        })
+        return;
+      }
 
-      if (response.status !== 200) {
+      if (username !== usernameConfirm) {
         toast({
           title: 'Error',
-          description: res.error,
+          description: 'Username confirmation does not match.',
           type: 'danger'
         })
+        return;
       }
 
-      if (response.status === 200) {
+      const response = await dashboardClient.pipe(
+        Effect.flatMap((client) =>
+          client.users.deleteUser({
+            payload: {
+              userId,
+              username,
+              usernameConfirm
+            }
+          })
+        ),
+        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,
-          type: 'success'
-        })
+          description: response.message || 'User deleted successfully.',
+          type: 'success',
+        });
       }
     })
 
@@ -429,78 +476,111 @@ if (isAdmin) allowedRanks.unshift({ label: 'Administrator', value: 'admin' });
 
       const formData = new FormData(editUserForm);
 
-      const data = {
-        id: formData.get('user-id')?.toString(),
-        rank: formData.get('rank')?.toString(),
-        emailVerified: formData.get('email-verified') === 'true'
-      }
+      const id = formData.get('user-id')?.toString();
+      let rank = formData.get('rank')?.toString();
+      const emailVerified = formData.get('email-verified')?.toString() === 'true';
 
-      const response = await fetch(editUserForm.action, {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify(data)
-      })
+      if (!id || !rank || emailVerified === undefined) {
+        toast({
+          title: 'Error',
+          description: 'Missing necessary data to update user.',
+          type: 'danger'
+        })
+        return;
+      }
 
-      const res = await response.json();
+      function isAvailableRank(rank: string): rank is AvailablePermissionRanks {
+        return availablePermissionRanks.includes(rank as AvailablePermissionRanks);
+      }
 
-      if (response.status !== 200) {
+      if (!isAvailableRank(rank)) {
         toast({
           title: 'Error',
-          description: res.error,
+          description: 'Invalid rank value.',
           type: 'danger'
         })
+        return;
       }
 
-      if (response.status === 200) {
+      const response = await dashboardClient.pipe(
+        Effect.flatMap((client) =>
+          client.users.updateUser({
+            payload: {
+              id,
+              emailVerified,
+              rank
+            }
+          })
+        ),
+        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,
-          type: 'success'
-        })
+          description: response.message || 'User updated successfully.',
+          type: 'success',
+        });
       }
     })
 
     deleteButtons.forEach((button) => {
         button.addEventListener('click', async (event) => {
             event.preventDefault();
+
             const tokenID = button.getAttribute('data-token');
             const userID = button.getAttribute('data-user');
-
-            const response = await fetch(tokenAPI, {
-                method: 'DELETE',
-                headers: {
-                    'Content-Type': 'application/json'
-                },
-                body: JSON.stringify({
-                    tokenID,
-                    userID
-                })
-            });
-
-            const res = await response.json();
-
-            if (!response.ok) {
+            
+            if (!tokenID || !userID) {
                 toast({
                     title: 'Error',
-                    description: res.error,
+                    description: 'Missing necessary data to revoke API token.',
                     type: 'danger',
                     duration: 5000
                 })
                 return;
             }
 
-            toast({
+            const response = await dashboardClient.pipe(
+              Effect.flatMap((client) =>
+                client.apiTokens.adminRevokeUserApiToken({
+                  payload: {
+                    tokenID,
+                    userID
+                  }
+                })
+              ),
+              Effect.catchTags(dashboardSharedCatchTags),
+              Effect.runPromise
+            );
+
+            if ('error' in response) {
+              toast({
+                title: 'Error',
+                description: response.error,
+                type: 'danger',
+                duration: 5000
+              })
+              return;
+            } else {
+              toast({
                 title: 'Success',
-                description: res.message,
+                description: response.message || 'API token revoked successfully.',
                 type: 'success',
                 duration: 5000
-            })
-
-            setTimeout(() => {
-              window.location.reload();
-            }, 1000);
+              })
+              setTimeout(() => {
+                window.location.reload();
+              }, 1000);
+            }
         });
     });
   </script>

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

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

package/frontend/pages/studiocms_api/[...all].ts

@@ -0,0 +1,106 @@
+import config from 'studiocms:config';
+import { HttpApiBuilder, HttpServerResponse } from '@effect/platform';
+import type { Api } from '@effect/platform/HttpApi';
+import {
+	StudioCMSAuthApi,
+	StudioCMSDashboardApiSpec,
+	StudioCMSIntegrationsApiSpec,
+	StudioCMSRestApiV1Spec,
+	StudioCMSSDKApiSpec,
+} from '@withstudiocms/api-spec';
+import type { APIRoute } from 'astro';
+import { Layer } from 'effect';
+import { HttpApiToAstroRoute } from 'effectify/astro/HttpApi';
+import * as Scalar from 'effectify/scalar';
+import { AuthAPILive } from './_handlers/auth/index.js';
+import { DashboardAPILive } from './_handlers/dashboard/index.js';
+import { IntegrationsAPILive } from './_handlers/integration/index.js';
+import { RestAPILive } from './_handlers/rest-api/index.js';
+import { SDKAPILive } from './_handlers/sdk.js';
+
+/**
+ * Scalar layer for the StudioCMS API Documentation route, providing a custom header and linking to the documentation for all API specifications.
+ */
+const DocsRouteLive = Scalar.layer({
+	title: 'StudioCMS API Documentation',
+	description:
+		'The Documentation for the StudioCMS API, including all available endpoints and specifications.',
+	customHeader: {
+		title: {
+			text: 'StudioCMS API Documentation',
+			link: '/studiocms_api/docs',
+		},
+		nav: [
+			{
+				text: 'StudioCMS Website',
+				link: 'https://studiocms.dev',
+			},
+			{
+				text: 'GitHub Repository',
+				link: 'https://github.com/withstudiocms/studiocms',
+			},
+			{
+				text: 'StudioCMS Discord',
+				link: 'https://chat.studiocms.dev',
+			},
+		],
+	},
+	path: '/studiocms_api/docs',
+	sources: [
+		{
+			title: 'Auth API',
+			httpApi: StudioCMSAuthApi,
+		},
+		{
+			title: 'Dashboard API',
+			httpApi: StudioCMSDashboardApiSpec,
+		},
+		{
+			title: 'Integrations API',
+			httpApi: StudioCMSIntegrationsApiSpec,
+		},
+		{
+			title: 'REST API v1',
+			httpApi: StudioCMSRestApiV1Spec,
+		},
+		{
+			title: 'SDK API',
+			httpApi: StudioCMSSDKApiSpec,
+		},
+	],
+});
+
+/**
+ * Catch-All Route Layer - Provides a catch-all route that redirects any unmatched requests to a 404 page.
+ *
+ * This is needed to ensure that any requests that are passed to the Effect API handlers return an Astro 404 page instead of the Effect 404 response.
+ */
+export const CatchAllGroup = HttpApiBuilder.Router.use((router) =>
+	router.get('*', HttpServerResponse.redirect('/404'))
+);
+
+/**
+ * Collection of API handlers for the new Effect HttpApi handlers
+ */
+const APICollection = Layer.mergeAll(
+	AuthAPILive,
+	IntegrationsAPILive,
+	RestAPILive,
+	SDKAPILive,
+	DashboardAPILive,
+	CatchAllGroup
+);
+
+/**
+ * Combined API Layer - Combines the API handlers with the documentation route if enabled in the configuration.
+ *
+ * If the API documentation is enabled, it merges the DocsRouteLive layer with the APICollection layer to serve both the API endpoints and the documentation. If the documentation is disabled, it only serves the API endpoints.
+ */
+const APILive: Layer.Layer<Api, never, never> = config.features.api.apiDocs
+	? Layer.merge(DocsRouteLive, APICollection)
+	: APICollection;
+
+/**
+ * Astro API Route - Converts the combined Effect API stack into an Astro route for serving the API documentation and endpoints.
+ */
+export const ALL: APIRoute = HttpApiToAstroRoute(APILive);

package/frontend/pages/studiocms_api/_handlers/_utils/auth.ts

@@ -0,0 +1,26 @@
+import { AuthAPIError } from '@withstudiocms/api-spec/auth';
+import { Effect } from 'effect';
+import { isValidEmail } from '#schemas/external-schemas';
+
+/**
+ * Utility service for authentication-related operations in the StudioCMS API.
+ */
+export class AuthAPIUtils extends Effect.Service<AuthAPIUtils>()(
+	'studiocms/routes/api/auth/shared/AuthAPIUtils',
+	{
+		effect: Effect.gen(function* () {
+			return {
+				validateEmail: (email: string) =>
+					Effect.try({
+						try: () => isValidEmail(email),
+						catch: () =>
+							new AuthAPIError({
+								error: 'Failed to validate email.',
+							}),
+					}),
+			};
+		}),
+	}
+) {
+	static Provide = Effect.provide(this.Default);
+}

package/frontend/pages/studiocms_api/_handlers/_utils/changelog.ts

@@ -0,0 +1,147 @@
+import { sdkClient } from 'studiocms:client/apiClients';
+import { HTTPClient } from '@withstudiocms/effect';
+import { loadChangelog, semverCategories } from '@withstudiocms/internal_helpers/utils';
+import { Data, Effect, pipe } from 'effect';
+import type { List, Root } from 'mdast';
+import { toMarkdown } from 'mdast-util-to-markdown';
+
+/**
+ * Custom error class used for quick escaping from deep error handling in the Effect chain.
+ */
+export class ChangelogError extends Data.TaggedError('ChangelogError')<{ message: string }> {}
+
+/**
+ * Service for processing the changelog of StudioCMS.
+ *
+ * This service fetches the raw changelog from the GitHub repository, processes it to extract relevant information, and renders it using a partial endpoint.
+ */
+export class ProcessChangelog extends Effect.Service<ProcessChangelog>()('ProcessChangelog', {
+	effect: Effect.gen(function* () {
+		const httpClient = yield* HTTPClient;
+
+		/**
+		 * Fetches the raw changelog markdown from the GitHub repository. If the fetch fails, it returns a ChangelogError with details about the failure.
+		 */
+		const getRawChangelog = () =>
+			Effect.gen(function* () {
+				const data = yield* httpClient.get(
+					'https://raw.githubusercontent.com/withstudiocms/studiocms/refs/heads/main/packages/studiocms/CHANGELOG.md'
+				);
+
+				if (data.status !== 200) {
+					return yield* new ChangelogError({
+						message: `Failed to fetch CHANGELOG.md: ${data.status} ${data.toString()}`,
+					});
+				}
+
+				return yield* data.text;
+			});
+
+		/**
+		 * Processes the raw changelog markdown to extract version information and changes, and then converts it back to markdown format. If any step in the processing fails, it returns a ChangelogError with details about the failure.
+		 * @param raw The raw changelog markdown content.
+		 * @returns The processed changelog in markdown format.
+		 * @throws ChangelogError if processing fails at any step.
+		 *
+		 */
+		const generateChangelog = (raw: string) =>
+			Effect.gen(function* () {
+				const ToProcess = yield* Effect.try(() => loadChangelog({ raw }));
+
+				const output: string[] = [];
+
+				const astEnd: Root = {
+					type: 'root',
+					children: [],
+				};
+
+				for (const version of ToProcess.versions) {
+					const versionChanges: List = { type: 'list', children: [] };
+
+					for (const semverCategory of semverCategories) {
+						for (const listItem of version.changes[semverCategory].children) {
+							versionChanges.children.push(listItem);
+						}
+					}
+
+					if (version.includes.size) {
+						versionChanges.children.push({
+							type: 'listItem',
+							children: [
+								{
+									type: 'paragraph',
+									children: [
+										{ type: 'text', value: `Includes: ${[...version.includes].join(', ')} ` },
+									],
+								},
+							],
+						});
+					}
+
+					if (!versionChanges.children.length) continue;
+
+					astEnd.children.push({
+						type: 'heading',
+						depth: 2,
+						children: [{ type: 'text', value: version.version }],
+					});
+
+					astEnd.children.push(versionChanges);
+				}
+
+				const outputData = yield* Effect.try(() => toMarkdown(astEnd, { bullet: '-' }));
+
+				output.push(outputData);
+
+				const markdownString = output.join('\n');
+
+				return markdownString;
+			});
+
+		/**
+		 * Renders the processed changelog markdown by sending it to a partial endpoint. If the rendering fails, it returns a ChangelogError with details about the failure.
+		 *
+		 * @param content The processed changelog markdown content to be rendered.
+		 * @returns The rendered changelog content as returned by the partial endpoint.
+		 */
+		const renderChangelog = (content: string) =>
+			Effect.gen(function* () {
+				const client = yield* sdkClient;
+
+				return yield* client.utils
+					.renderMarkdown({
+						payload: {
+							content,
+						},
+						urlParams: {},
+					})
+					.pipe(Effect.map((response) => response.html));
+			});
+
+		/**
+		 * Runs the entire changelog processing pipeline, which includes fetching the raw changelog, generating the processed markdown, and rendering it. If any step in the pipeline fails, it returns a ChangelogError with details about the failure.
+		 */
+		const runPipeline = () =>
+			pipe(
+				getRawChangelog(),
+				Effect.flatMap(generateChangelog),
+				Effect.flatMap(renderChangelog),
+				Effect.catchAll(
+					(error) =>
+						new ChangelogError({
+							message: `Failed to process changelog: ${error instanceof Error ? error.message : String(error)}`,
+						})
+				)
+			);
+
+		return {
+			getRawChangelog,
+			generateChangelog,
+			renderChangelog,
+			runPipeline,
+		};
+	}),
+	dependencies: [HTTPClient.Default],
+}) {
+	static Provide = Effect.provide(this.Default);
+}