load rules from new repo

src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/repository/index.ts

@@ -1,4 +1,6 @@
-export * from './stylesheet-detail.repository.js';
+export * from './rich-text-rule/index.js';
 export * from './item/index.js';
+
+export * from './stylesheet-detail.repository.js';
 export { UMB_STYLESHEET_REPOSITORY_ALIAS } from './manifests.js';
 export { type UmbStylesheetDetailStore, UMB_STYLESHEET_DETAIL_STORE_CONTEXT } from './stylesheet-detail.store.js';

src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/repository/rich-text-rule/stylesheet-rich-text-rule.repository.ts

@@ -15,8 +15,8 @@ export class UmbStylesheetRichTextRuleRepository extends UmbRepositoryBase {
 		this.#dataSource = new UmbStylesheetRichTextRuleServerDataSource(host);
 	}
 
-	requestStylesheetRules(path: string) {
-		return this.#dataSource.getStylesheetRichTextRules(path);
+	requestStylesheetRules(unique: string) {
+		return this.#dataSource.getStylesheetRichTextRules(unique);
 	}
 
 	/**

src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/repository/rich-text-rule/stylesheet-rich-text-rule.server.data-source.ts

@@ -1,3 +1,4 @@
+import { UmbServerPathUniqueSerializer } from '../../../utils/index.js';
 import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
 import {
 	ExtractRichTextStylesheetRulesRequestModel,
@@ -13,6 +14,7 @@ import { tryExecuteAndNotify } from '@umbraco-cms/backoffice/resources';
  */
 export class UmbStylesheetRichTextRuleServerDataSource {
 	#host: UmbControllerHost;
+	#serverPathUniqueSerializer = new UmbServerPathUniqueSerializer();
 
 	/**
 	 * Creates an instance of UmbStylesheetRichTextRuleServerDataSource.
@@ -26,11 +28,12 @@ export class UmbStylesheetRichTextRuleServerDataSource {
 	/**
 	 * Get's the rich text rules for a stylesheet
 	 *
-	 * @param {string} path
+	 * @param {string} unique
 	 * @return {*}
 	 * @memberof UmbStylesheetRichTextRuleServerDataSource
 	 */
-	getStylesheetRichTextRules(path: string) {
+	getStylesheetRichTextRules(unique: string) {
+		const path = this.#serverPathUniqueSerializer.toServerPath(unique);
 		return tryExecuteAndNotify(this.#host, StylesheetResource.getStylesheetRichTextRules({ path }));
 	}
 

src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/workspace/stylesheet-workspace.context.ts

@@ -77,27 +77,6 @@ export class UmbStylesheetWorkspaceContext
 			this.setIsNew(false);
 			this.#data.next(data);
 		}
-
-		/*
-		const [{ data }, rules] = await Promise.all([
-			this.repository.requestById(path),
-			this.repository.getStylesheetRules(path),
-		]);
-
-		if (data) {
-			this.setIsNew(false);
-			this.#data.update(data);
-		} else {
-			this.#data.update(undefined);
-		}
-
-		if (rules.data) {
-			const x = rules.data.rules?.map((r, i) => ({ ...r, sortOrder: i })) ?? [];
-			this.#rules.next(x);
-		} else {
-			this.#rules.next([]);
-		}
-		*/
 	}
 
 	async create(parentUnique: string | null) {

src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/workspace/views/rich-text-rule/stylesheet-rich-text-rule-workspace-view.element.ts

@@ -1,5 +1,6 @@
 import { RichTextRuleModelSortable, UmbStylesheetWorkspaceContext } from '../../stylesheet-workspace.context.js';
 import { UMB_MODAL_TEMPLATING_STYLESHEET_RTF_STYLE_SIDEBAR } from '../../manifests.js';
+import { UmbStylesheetRichTextRuleRepository } from '../../../repository/rich-text-rule/index.js';
 import { StylesheetRichTextEditorStyleModalValue } from './stylesheet-workspace-view-rich-text-editor-style-sidebar.element.js';
 import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
 import { UmbLitElement } from '@umbraco-cms/internal/lit-element';
@@ -42,6 +43,8 @@ export class UmbStylesheetRichTextRuleWorkspaceViewElement extends UmbLitElement
 	#context?: UmbStylesheetWorkspaceContext;
 	private _modalContext?: UmbModalManagerContext;
 
+	#stylesheetRichTextRuleRepository = new UmbStylesheetRichTextRuleRepository(this);
+
 	#sorter = new UmbSorterController(this, {
 		...SORTER_CONFIG,
 		performItemInsert: ({ item, newIndex }) => {
@@ -58,11 +61,8 @@ export class UmbStylesheetRichTextRuleWorkspaceViewElement extends UmbLitElement
 
 		this.consumeContext(UMB_WORKSPACE_CONTEXT, (workspaceContext) => {
 			this.#context = workspaceContext as UmbStylesheetWorkspaceContext;
-
-			this.observe(this.#context.rules, (rules) => {
-				this._rules = rules;
-				this.#sorter.setModel(this._rules);
-			});
+			const unique = this.#context?.getEntityId();
+			this.#setRules(unique);
 		});
 
 		this.consumeContext(UMB_MODAL_MANAGER_CONTEXT_TOKEN, (instance) => {
@@ -70,6 +70,15 @@ export class UmbStylesheetRichTextRuleWorkspaceViewElement extends UmbLitElement
 		});
 	}
 
+	async #setRules(unique: string) {
+		const { data } = await this.#stylesheetRichTextRuleRepository.requestStylesheetRules(unique);
+
+		if (data) {
+			this._rules = data.rules ?? [];
+			this.#sorter.setModel(this._rules);
+		}
+	}
+
 	openModal = (rule: RichTextRuleModelSortable | null = null) => {
 		if (!this._modalContext) throw new Error('Modal context not found');
 		const modal = this._modalContext.open(UMB_MODAL_TEMPLATING_STYLESHEET_RTF_STYLE_SIDEBAR_MODAL, {