pkp/pkp-lib#9421 Pass configAllowedHtml config from server, fix story…

…book

.storybook/preview.js

@@ -56,7 +56,7 @@ setup((app) => {
 	app.use(pinia);
 
 	// directives
-	vueApp.directive('pkp-allowed-html', allowedHtmlDirective);
+	app.directive('pkp-allowed-html', allowedHtmlDirective);
 
 	app.mixin(GlobalMixins);
 

public/globals.js

@@ -3,6 +3,11 @@
  * are not part of the UI Library's responsibilities
  */
 window.pkp = {
+	serverContext: {
+		configAllowedHtml:
+			'a[href|target|title],em,strong,cite,code,ul,ol,li[class],dl,dt,dd,b,i,u,img[src|alt],sup,sub,br,p',
+		apiBaseUrl: 'https://mock/index.php/publicknowledge/api/v1/',
+	},
 	/**
 	 * Event bus. This will be a Vue instance but must be registered in main.js
 	 * where Vue can be imported

src/composables/useApiUrl.js

@@ -6,14 +6,14 @@ import {ref, computed} from 'vue';
  */
 
 export function useApiUrl(_path) {
-	if (typeof pkp === 'undefined' || !pkp?.context?.apiBaseUrl) {
-		throw new Error('pkp.context.apiBaseUrl is not configured');
+	if (typeof pkp === 'undefined' || !pkp?.serverContext?.apiBaseUrl) {
+		throw new Error('pkp.serverContext.apiBaseUrl is not configured');
 	}
 
 	// normalise to be ref even if its not passed as ref
 	const path = ref(_path);
 
-	const apiUrl = computed(() => `${pkp.context.apiBaseUrl}${path.value}`);
+	const apiUrl = computed(() => `${pkp.serverContext.apiBaseUrl}${path.value}`);
 
 	return {apiUrl};
 }

src/directive/allowedHtml.js

@@ -1,7 +1,10 @@
 import DOMPurify from 'dompurify';
 
-const allowed_html =
-	'a[href|target|title],em,strong,cite,code,ul,ol,li[class],dl,dt,dd,b,i,u,img[src|alt],sup,sub,br,p';
+if (typeof pkp === 'undefined' || !pkp?.serverContext?.configAllowedHtml) {
+	throw new Error('pkp.serverContext.configAllowedHtml is not configured');
+}
+
+const allowed_html = pkp.serverContext.configAllowedHtml;
 
 const ALLOWED_TAGS = [];
 const ALLOWED_ATTR = [];