@btst/stack 3.0.0-rc.2 → 3.0.0-rc.3

package/src/plugins/cms/api/relations.ts

@@ -6,6 +6,8 @@ import type {
 	RelationValue,
 } from "../types";
 
+type DataAdapter = Omit<Adapter, "transaction">;
+
 /**
  * Shape of a property inside a content type's stored JSON Schema.
  * Relation fields carry `fieldType: "relation"` and a `relation` descriptor.
@@ -146,7 +148,7 @@ export function collectExistingRelationIds(
  * fieldName) are deleted and replaced with the provided target IDs.
  */
 export async function syncRelations(
-	adapter: Adapter,
+	adapter: DataAdapter,
 	sourceId: string,
 	relationIds: Record<string, string[]>,
 ): Promise<void> {

package/src/plugins/cms/client/components/forms/content-form.tsx

@@ -15,6 +15,7 @@ import { Label } from "@workspace/ui/components/label";
 import { Badge } from "@workspace/ui/components/badge";
 import { usePluginOverrides, useTranslate } from "@btst/stack/context";
 import type { CMSPluginOverrides } from "../../overrides";
+import { CMS_PLUGIN_ID } from "../../constants";
 import type { SerializedContentType, RelationConfig } from "../../../types";
 import { slugify } from "../../../utils";
 import { CMSFileUpload } from "./file-upload";
@@ -258,7 +259,7 @@ export function ContentForm({
 		imagePicker,
 		imageInputField,
 		fieldComponents,
-	} = usePluginOverrides<CMSPluginOverrides>("cms");
+	} = usePluginOverrides<CMSPluginOverrides>(CMS_PLUGIN_ID);
 
 	const [slug, setSlug] = useState(initialSlug);
 	const [slugManuallyEdited, setSlugManuallyEdited] = useState(isEditing);

package/src/plugins/cms/client/components/forms/file-upload.tsx

@@ -13,6 +13,7 @@ import {
 	useTranslate,
 } from "@btst/stack/context";
 import type { CMSPluginOverrides } from "../../overrides";
+import { CMS_PLUGIN_ID } from "../../constants";
 import type { AutoFormInputComponentProps } from "@workspace/ui/components/auto-form/types";
 import { Input } from "@workspace/ui/components/input";
 import { Button } from "@workspace/ui/components/button";
@@ -94,7 +95,8 @@ export function CMSFileUpload({
 	// All hooks must be called unconditionally before any early return.
 	const t = useTranslate();
 	const notify = useNotify();
-	const { localization } = usePluginOverrides<CMSPluginOverrides>("cms");
+	const { localization } =
+		usePluginOverrides<CMSPluginOverrides>(CMS_PLUGIN_ID);
 	const [isUploading, setIsUploading] = useState(false);
 	const [previewUrl, setPreviewUrl] = useState<string | null>(
 		field.value || null,

package/src/plugins/cms/client/components/forms/relation-field.tsx

@@ -5,6 +5,7 @@ import { usePluginOverrides, useTranslate } from "@btst/stack/context";
 import { useCreateContent, useContentOptions } from "../../hooks";
 import type { SerializedContentItemWithType } from "../../../types";
 import type { CMSPluginOverrides } from "../../overrides";
+import { CMS_PLUGIN_ID } from "../../constants";
 import MultipleSelector from "@workspace/ui/components/multi-select";
 import type { Option } from "@workspace/ui/components/multi-select";
 import { Button } from "@workspace/ui/components/button";
@@ -51,7 +52,8 @@ export function RelationField({
 	const [newItemDescription, setNewItemDescription] = useState("");
 	const [createError, setCreateError] = useState<string | null>(null);
 
-	const { localization } = usePluginOverrides<CMSPluginOverrides>("cms");
+	const { localization } =
+		usePluginOverrides<CMSPluginOverrides>(CMS_PLUGIN_ID);
 
 	// For belongsTo (single relation), we only allow one selection
 	const isSingleSelect = relation.type === "belongsTo";

package/src/plugins/cms/client/components/inverse-relations-panel.tsx

@@ -16,19 +16,21 @@ import {
 	CardTitle,
 } from "@workspace/ui/components/card";
 import {
-	CanAccess,
+	joinBasePath,
+	PermissionAccess,
 	usePluginOverrides,
-	useBasePath,
 	useStack,
 	useTranslate,
 	type TranslateFn,
 } from "@btst/stack/context";
+import { cmsPermissions } from "../../permissions";
 import {
 	useDeleteContent,
 	useInverseRelations,
 	useInverseRelationItems,
 } from "../hooks";
 import type { CMSPluginOverrides } from "../overrides";
+import { CMS_PLUGIN_ID } from "../constants";
 import type {
 	InverseRelation,
 	SerializedContentItemWithType,
@@ -58,11 +60,12 @@ export function InverseRelationsPanel({
 	itemId,
 }: InverseRelationsPanelProps) {
 	const t = useTranslate();
-	const { localization } = usePluginOverrides<CMSPluginOverrides>("cms");
-	const { router } = useStack();
+	const { localization } =
+		usePluginOverrides<CMSPluginOverrides>(CMS_PLUGIN_ID);
+	const { router, plugins, basePath: stackBasePath } = useStack();
 	const navigate = router?.navigate;
 	const Link = router?.Link;
-	const basePath = useBasePath();
+	const basePath = plugins?.[CMS_PLUGIN_ID]?.site.basePath ?? stackBasePath;
 
 	// Fetch inverse relations metadata
 	const { inverseRelations, isLoading } = useInverseRelations(
@@ -219,7 +222,10 @@ function InverseRelationSection({
 	const handleAddNew = () => {
 		// Navigate to create page with query param to pre-fill the relation.
 		// ContentEditorPage reads prefill_* query params and passes them to ContentForm as initialData.
-		const createUrl = `${basePath}/cms/${relation.sourceType}/new?prefill_${relation.fieldName}=${itemId}`;
+		const createUrl = joinBasePath(
+			basePath,
+			`/cms/${relation.sourceType}/new?prefill_${relation.fieldName}=${itemId}`,
+		);
 		void navigate?.(createUrl);
 	};
 
@@ -269,7 +275,10 @@ function InverseRelationSection({
 						<ul className="space-y-2">
 							{items.map((item: SerializedContentItemWithType) => {
 								const displayValue = getDisplayValue(item);
-								const editUrl = `${basePath}/cms/${relation.sourceType}/${item.id}`;
+								const editUrl = joinBasePath(
+									basePath,
+									`/cms/${relation.sourceType}/${item.id}`,
+								);
 								return (
 									<li
 										key={item.id}
@@ -282,10 +291,13 @@ function InverseRelationSection({
 											<span className="truncate">{displayValue}</span>
 											<ExternalLink className="h-3 w-3 opacity-50" />
 										</LinkComponent>
-										<CanAccess
-											resource="cms:content"
-											action="delete"
-											params={{ typeSlug: relation.sourceType, id: item.id }}
+										<PermissionAccess
+											permission={cmsPermissions.record.delete({
+												contentType:
+													item.contentType?.slug ?? relation.sourceType,
+												recordId: item.id,
+												...(item.authorId ? { authorId: item.authorId } : {}),
+											})}
 										>
 											<Button
 												variant="ghost"
@@ -295,17 +307,17 @@ function InverseRelationSection({
 											>
 												<Trash2 className="h-3.5 w-3.5" />
 											</Button>
-										</CanAccess>
+										</PermissionAccess>
 									</li>
 								);
 							})}
 						</ul>
 					)}
 					<div className="mt-3 pt-3 border-t">
-						<CanAccess
-							resource="cms:content"
-							action="create"
-							params={{ typeSlug: relation.sourceType }}
+						<PermissionAccess
+							permission={cmsPermissions.record.create({
+								contentType: relation.sourceType,
+							})}
 						>
 							<Button
 								variant="outline"
@@ -320,7 +332,7 @@ function InverseRelationSection({
 								).replace("{sourceTypeName}", relation.sourceTypeName)}
 								{fieldLabel ? ` (${fieldLabel})` : ""}
 							</Button>
-						</CanAccess>
+						</PermissionAccess>
 					</div>
 				</CardContent>
 			)}

package/src/plugins/cms/client/components/pages/404-page.tsx

@@ -2,18 +2,20 @@
 
 import { Button } from "@workspace/ui/components/button";
 import {
+	joinBasePath,
 	usePluginOverrides,
-	useBasePath,
 	useStack,
 	useTranslate,
 } from "@btst/stack/context";
 import type { CMSPluginOverrides } from "../../overrides";
+import { CMS_PLUGIN_ID } from "../../constants";
 
 export function NotFoundPage() {
 	const t = useTranslate();
-	const { localization } = usePluginOverrides<CMSPluginOverrides>("cms");
-	const { router } = useStack();
-	const basePath = useBasePath();
+	const { localization } =
+		usePluginOverrides<CMSPluginOverrides>(CMS_PLUGIN_ID);
+	const { router, plugins, basePath: stackBasePath } = useStack();
+	const basePath = plugins?.[CMS_PLUGIN_ID]?.site.basePath ?? stackBasePath;
 
 	const LinkComponent = router?.Link ?? "a";
 
@@ -32,7 +34,7 @@ export function NotFoundPage() {
 					)}
 			</p>
 			<Button asChild>
-				<LinkComponent href={`${basePath}/cms`}>
+				<LinkComponent href={joinBasePath(basePath, "/cms")}>
 					{localization?.CMS_404_BACK ?? t("cms.common.404Back", "Back to CMS")}
 				</LinkComponent>
 			</Button>

package/src/plugins/cms/client/components/pages/content-editor-page.internal.tsx

@@ -4,12 +4,13 @@ import { useState, useEffect } from "react";
 import { ArrowLeft } from "lucide-react";
 import { Button } from "@workspace/ui/components/button";
 import {
+	joinBasePath,
 	usePluginOverrides,
-	useBasePath,
 	useStack,
 	useTranslate,
 } from "@btst/stack/context";
-import type { CMSPluginOverrides } from "../../overrides";
+import { orderCMSContentTypes, type CMSPluginOverrides } from "../../overrides";
+import { CMS_PLUGIN_ID } from "../../constants";
 import {
 	useSuspenseContentTypes,
 	useContentItem,
@@ -135,17 +136,17 @@ interface ContentEditorPageProps {
 
 export function ContentEditorPage({ typeSlug, id }: ContentEditorPageProps) {
 	const t = useTranslate();
-	const overrides = usePluginOverrides<CMSPluginOverrides>("cms");
+	const overrides = usePluginOverrides<CMSPluginOverrides>(CMS_PLUGIN_ID);
 	const { localization } = overrides;
-	const { router } = useStack();
+	const { router, plugins, basePath: stackBasePath } = useStack();
 	const navigate = router?.navigate;
-	const basePath = useBasePath();
+	const basePath = plugins?.[CMS_PLUGIN_ID]?.site.basePath ?? stackBasePath;
 
 	// Parse prefill query parameters for pre-populating fields when creating new items
 	// This is used by the inverse relations panel to pre-fill the parent relation
 	const prefillParams = usePrefillParams();
 
-	// Call lifecycle hooks for authorization
+	// Call route lifecycle hooks for telemetry and application behavior.
 	useRouteLifecycle({
 		routeName: "contentEditor",
 		context: {
@@ -156,7 +157,11 @@ export function ContentEditorPage({ typeSlug, id }: ContentEditorPageProps) {
 		overrides,
 	});
 
-	const { contentTypes } = useSuspenseContentTypes();
+	const { contentTypes: serverContentTypes } = useSuspenseContentTypes();
+	const contentTypes = orderCMSContentTypes(
+		serverContentTypes,
+		plugins?.[CMS_PLUGIN_ID]?.config,
+	);
 	const contentType = contentTypes.find((ct) => ct.slug === typeSlug);
 
 	const isEditing = !!id;
@@ -191,7 +196,7 @@ export function ContentEditorPage({ typeSlug, id }: ContentEditorPageProps) {
 			data: { slug: values.slug, data: values.data },
 		}),
 		onSuccess: () => {
-			void navigate?.(`${basePath}/cms/${typeSlug}`);
+			void navigate?.(joinBasePath(basePath, `/cms/${typeSlug}`));
 		},
 	});
 
@@ -272,7 +277,9 @@ export function ContentEditorPage({ typeSlug, id }: ContentEditorPageProps) {
 					<Button
 						variant="ghost"
 						size="icon"
-						onClick={() => void navigate?.(`${basePath}/cms/${typeSlug}`)}
+						onClick={() =>
+							void navigate?.(joinBasePath(basePath, `/cms/${typeSlug}`))
+						}
 					>
 						<ArrowLeft className="h-4 w-4" />
 					</Button>
@@ -295,7 +302,9 @@ export function ContentEditorPage({ typeSlug, id }: ContentEditorPageProps) {
 					initialSlug={item?.slug}
 					isEditing={isEditing}
 					onSubmit={handleSubmit}
-					onCancel={() => void navigate?.(`${basePath}/cms/${typeSlug}`)}
+					onCancel={() =>
+						void navigate?.(joinBasePath(basePath, `/cms/${typeSlug}`))
+					}
 					fieldErrors={resourceForm.fieldErrors}
 					errorMessage={
 						hasFieldErrors ? undefined : resourceForm.error?.message

package/src/plugins/cms/client/components/pages/content-editor-page.tsx

@@ -3,10 +3,16 @@
 import { lazy } from "react";
 import { usePluginOverrides } from "@btst/stack/context";
 import type { CMSPluginOverrides } from "../../overrides";
-import { ComposedRoute } from "@btst/stack/client/components";
+import { CMS_PLUGIN_ID } from "../../constants";
+import {
+	ComposedRoute,
+	PermissionRouteAccess,
+} from "@btst/stack/client/components";
 import { DefaultError } from "../shared/default-error";
 import { EditorSkeleton } from "../loading";
 import { NotFoundPage } from "./404-page";
+import { cmsPermissions } from "../../../permissions";
+import { useSuspenseContentItem } from "../../hooks";
 
 const ContentEditorPageInternal = lazy(() =>
 	import("./content-editor-page.internal").then((m) => ({
@@ -23,7 +29,8 @@ export function ContentEditorPageComponent({
 	typeSlug,
 	id,
 }: ContentEditorPageComponentProps) {
-	const { onRouteError } = usePluginOverrides<CMSPluginOverrides>("cms");
+	const { onRouteError } =
+		usePluginOverrides<CMSPluginOverrides>(CMS_PLUGIN_ID);
 
 	const isNew = !id;
 	const path = isNew ? `/cms/${typeSlug}/new` : `/cms/${typeSlug}/${id}`;
@@ -31,19 +38,10 @@ export function ContentEditorPageComponent({
 	return (
 		<ComposedRoute
 			path={path}
-			PageComponent={ContentEditorPageInternal}
+			PageComponent={AuthorizedContentEditorPage}
 			ErrorComponent={DefaultError}
 			LoadingComponent={EditorSkeleton}
 			NotFoundComponent={NotFoundPage}
-			permission={
-				isNew
-					? { resource: "cms:content", action: "create", params: { typeSlug } }
-					: {
-							resource: "cms:content",
-							action: "update",
-							params: { typeSlug, id },
-						}
-			}
 			props={{ typeSlug, id }}
 			onError={(error) => {
 				if (onRouteError) {
@@ -57,3 +55,43 @@ export function ContentEditorPageComponent({
 		/>
 	);
 }
+
+function AuthorizedContentEditorPage({
+	typeSlug,
+	id,
+}: ContentEditorPageComponentProps) {
+	if (!id) {
+		return (
+			<PermissionRouteAccess
+				permission={cmsPermissions.record.create({ contentType: typeSlug })}
+				LoadingComponent={EditorSkeleton}
+			>
+				<ContentEditorPageInternal typeSlug={typeSlug} />
+			</PermissionRouteAccess>
+		);
+	}
+	return <AuthorizedExistingContentEditorPage typeSlug={typeSlug} id={id} />;
+}
+
+function AuthorizedExistingContentEditorPage({
+	typeSlug,
+	id,
+}: {
+	typeSlug: string;
+	id: string;
+}) {
+	const { item } = useSuspenseContentItem(typeSlug, id);
+	if (!item) return <ContentEditorPageInternal typeSlug={typeSlug} id={id} />;
+	return (
+		<PermissionRouteAccess
+			permission={cmsPermissions.record.update({
+				contentType: item.contentType?.slug ?? typeSlug,
+				recordId: item.id,
+				...(item.authorId ? { authorId: item.authorId } : {}),
+			})}
+			LoadingComponent={EditorSkeleton}
+		>
+			<ContentEditorPageInternal typeSlug={typeSlug} id={id} />
+		</PermissionRouteAccess>
+	);
+}

package/src/plugins/cms/client/components/pages/content-list-page.internal.tsx

@@ -13,16 +13,18 @@ import {
 	TableRow,
 } from "@workspace/ui/components/table";
 import {
-	CanAccess,
+	joinBasePath,
+	PermissionAccess,
 	useNotify,
 	usePluginOverrides,
-	useBasePath,
 	useStack,
 	useTranslate,
 	type TranslateFn,
 } from "@btst/stack/context";
-import { useListState, type ListStateSchema } from "@btst/stack/client";
-import type { CMSPluginOverrides } from "../../overrides";
+import { cmsPermissions } from "../../../permissions";
+import { useListState, type ListStateSchema } from "@btst/stack/client/hooks";
+import { orderCMSContentTypes, type CMSPluginOverrides } from "../../overrides";
+import { CMS_PLUGIN_ID } from "../../constants";
 import type { SerializedContentItemWithType } from "../../../types";
 import {
 	useContent,
@@ -49,14 +51,14 @@ const SEARCH_DEBOUNCE_MS = 300;
 export function ContentListPage({ typeSlug }: ContentListPageProps) {
 	const t = useTranslate();
 	const notify = useNotify();
-	const overrides = usePluginOverrides<CMSPluginOverrides>("cms");
+	const overrides = usePluginOverrides<CMSPluginOverrides>(CMS_PLUGIN_ID);
 	const { localization } = overrides;
-	const { router } = useStack();
+	const { router, plugins, basePath: stackBasePath } = useStack();
 	const navigate = router?.navigate;
 	const Link = router?.Link;
-	const basePath = useBasePath();
+	const basePath = plugins?.[CMS_PLUGIN_ID]?.site.basePath ?? stackBasePath;
 
-	// Call lifecycle hooks for authorization
+	// Call route lifecycle hooks for telemetry and application behavior.
 	useRouteLifecycle({
 		routeName: "contentList",
 		context: {
@@ -100,7 +102,11 @@ export function ContentListPage({ typeSlug }: ContentListPageProps) {
 
 	const hasSearch = search.trim().length > 0;
 
-	const { contentTypes } = useSuspenseContentTypes();
+	const { contentTypes: serverContentTypes } = useSuspenseContentTypes();
+	const contentTypes = orderCMSContentTypes(
+		serverContentTypes,
+		plugins?.[CMS_PLUGIN_ID]?.config,
+	);
 	const contentType = contentTypes.find((ct) => ct.slug === typeSlug);
 
 	// The default (unsearched) list stays on the suspense hook so SSR/SSG
@@ -168,7 +174,7 @@ export function ContentListPage({ typeSlug }: ContentListPageProps) {
 						<Button
 							variant="ghost"
 							size="icon"
-							onClick={() => void navigate?.(`${basePath}/cms`)}
+							onClick={() => void navigate?.(joinBasePath(basePath, "/cms"))}
 						>
 							<ArrowLeft className="h-4 w-4" />
 						</Button>
@@ -183,19 +189,21 @@ export function ContentListPage({ typeSlug }: ContentListPageProps) {
 							)}
 						</div>
 					</div>
-					<CanAccess
-						resource="cms:content"
-						action="create"
-						params={{ typeSlug }}
+					<PermissionAccess
+						permission={cmsPermissions.record.create({
+							contentType: typeSlug,
+						})}
 					>
 						<Button
-							onClick={() => void navigate?.(`${basePath}/cms/${typeSlug}/new`)}
+							onClick={() =>
+								void navigate?.(joinBasePath(basePath, `/cms/${typeSlug}/new`))
+							}
 						>
 							<Plus className="h-4 w-4 mr-2" />
 							{localization?.CMS_BUTTON_NEW_ITEM ??
 								t("cms.common.newItem", "New Item")}
 						</Button>
-					</CanAccess>
+					</PermissionAccess>
 				</div>
 
 				<div className="relative max-w-sm">
@@ -244,21 +252,23 @@ export function ContentListPage({ typeSlug }: ContentListPageProps) {
 								)
 							}
 							action={
-								<CanAccess
-									resource="cms:content"
-									action="create"
-									params={{ typeSlug }}
+								<PermissionAccess
+									permission={cmsPermissions.record.create({
+										contentType: typeSlug,
+									})}
 								>
 									<Button
 										onClick={() =>
-											void navigate?.(`${basePath}/cms/${typeSlug}/new`)
+											void navigate?.(
+												joinBasePath(basePath, `/cms/${typeSlug}/new`),
+											)
 										}
 									>
 										<Plus className="h-4 w-4 mr-2" />
 										{localization?.CMS_BUTTON_CREATE ??
 											t("cms.common.create", "Create")}
 									</Button>
-								</CanAccess>
+								</PermissionAccess>
 							}
 						/>
 					)
@@ -344,7 +354,7 @@ function ContentTable({
 						<TableRow key={item.id}>
 							<TableCell className="font-medium">
 								<LinkComponent
-									href={`${basePath}/cms/${typeSlug}/${item.id}`}
+									href={joinBasePath(basePath, `/cms/${typeSlug}/${item.id}`)}
 									className="hover:underline"
 								>
 									{item.slug}
@@ -354,27 +364,31 @@ function ContentTable({
 							<TableCell>{formatDate(item.updatedAt)}</TableCell>
 							<TableCell>
 								<div className="flex items-center gap-1">
-									<CanAccess
-										resource="cms:content"
-										action="update"
-										params={{ typeSlug, id: item.id }}
+									<PermissionAccess
+										permission={cmsPermissions.record.update({
+											contentType: item.contentType?.slug ?? typeSlug,
+											recordId: item.id,
+											...(item.authorId ? { authorId: item.authorId } : {}),
+										})}
 									>
 										<Button
 											variant="ghost"
 											size="icon"
 											onClick={() =>
 												void navigate?.(
-													`${basePath}/cms/${typeSlug}/${item.id}`,
+													joinBasePath(basePath, `/cms/${typeSlug}/${item.id}`),
 												)
 											}
 										>
 											<Pencil className="h-4 w-4" />
 										</Button>
-									</CanAccess>
-									<CanAccess
-										resource="cms:content"
-										action="delete"
-										params={{ typeSlug, id: item.id }}
+									</PermissionAccess>
+									<PermissionAccess
+										permission={cmsPermissions.record.delete({
+											contentType: item.contentType?.slug ?? typeSlug,
+											recordId: item.id,
+											...(item.authorId ? { authorId: item.authorId } : {}),
+										})}
 									>
 										<Button
 											variant="ghost"
@@ -384,7 +398,7 @@ function ContentTable({
 										>
 											<Trash2 className="h-4 w-4 text-destructive" />
 										</Button>
-									</CanAccess>
+									</PermissionAccess>
 								</div>
 							</TableCell>
 						</TableRow>

package/src/plugins/cms/client/components/pages/content-list-page.tsx

@@ -3,10 +3,12 @@
 import { lazy } from "react";
 import { usePluginOverrides } from "@btst/stack/context";
 import type { CMSPluginOverrides } from "../../overrides";
+import { CMS_PLUGIN_ID } from "../../constants";
 import { ComposedRoute } from "@btst/stack/client/components";
 import { DefaultError } from "../shared/default-error";
 import { ListSkeleton } from "../loading";
 import { NotFoundPage } from "./404-page";
+import { cmsPermissions } from "../../../permissions";
 
 const ContentListPageInternal = lazy(() =>
 	import("./content-list-page.internal").then((m) => ({
@@ -21,11 +23,16 @@ interface ContentListPageComponentProps {
 export function ContentListPageComponent({
 	typeSlug,
 }: ContentListPageComponentProps) {
-	const { onRouteError } = usePluginOverrides<CMSPluginOverrides>("cms");
+	const { onRouteError } =
+		usePluginOverrides<CMSPluginOverrides>(CMS_PLUGIN_ID);
 
 	return (
 		<ComposedRoute
 			path={`/cms/${typeSlug}`}
+			permission={cmsPermissions.record.read({
+				contentType: typeSlug,
+				scope: "collection",
+			})}
 			PageComponent={ContentListPageInternal}
 			ErrorComponent={DefaultError}
 			LoadingComponent={ListSkeleton}

package/src/plugins/cms/client/components/pages/dashboard-page.internal.tsx

@@ -8,12 +8,13 @@ import {
 	CardTitle,
 } from "@workspace/ui/components/card";
 import {
+	joinBasePath,
 	usePluginOverrides,
-	useBasePath,
 	useStack,
 	useTranslate,
 } from "@btst/stack/context";
-import type { CMSPluginOverrides } from "../../overrides";
+import { orderCMSContentTypes, type CMSPluginOverrides } from "../../overrides";
+import { CMS_PLUGIN_ID } from "../../constants";
 import { useSuspenseContentTypes } from "../../hooks";
 import { EmptyState } from "../shared/empty-state";
 import { PageWrapper } from "../shared/page-wrapper";
@@ -21,13 +22,13 @@ import { useRouteLifecycle } from "@workspace/ui/hooks/use-route-lifecycle";
 
 export function DashboardPage() {
 	const t = useTranslate();
-	const overrides = usePluginOverrides<CMSPluginOverrides>("cms");
+	const overrides = usePluginOverrides<CMSPluginOverrides>(CMS_PLUGIN_ID);
 	const { localization } = overrides;
-	const { router } = useStack();
+	const { router, plugins, basePath: stackBasePath } = useStack();
 	const navigate = router?.navigate;
-	const basePath = useBasePath();
+	const basePath = plugins?.[CMS_PLUGIN_ID]?.site.basePath ?? stackBasePath;
 
-	// Call lifecycle hooks for authorization
+	// Call route lifecycle hooks for telemetry and application behavior.
 	useRouteLifecycle({
 		routeName: "dashboard",
 		context: {
@@ -36,7 +37,11 @@ export function DashboardPage() {
 		},
 		overrides,
 	});
-	const { contentTypes } = useSuspenseContentTypes();
+	const { contentTypes: serverContentTypes } = useSuspenseContentTypes();
+	const contentTypes = orderCMSContentTypes(
+		serverContentTypes,
+		plugins?.[CMS_PLUGIN_ID]?.config,
+	);
 
 	const title =
 		localization?.CMS_DASHBOARD_TITLE ?? t("cms.dashboard.title", "Content");
@@ -100,7 +105,9 @@ export function DashboardPage() {
 						<Card
 							key={ct.id}
 							className="hover:border-primary/50 transition-colors cursor-pointer"
-							onClick={() => void navigate?.(`${basePath}/cms/${ct.slug}`)}
+							onClick={() =>
+								void navigate?.(joinBasePath(basePath, `/cms/${ct.slug}`))
+							}
 						>
 							<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
 								<CardTitle className="text-lg font-medium">{ct.name}</CardTitle>