From a704071448491d7b5a9c0e09306f3ad29e43b5dd Mon Sep 17 00:00:00 2001
From: Rishabh Garg <rish@ghost.org>
Date: Fri, 21 Apr 2023 20:18:28 +0530
Subject: [PATCH] Added pintura config for lexical editor (#16698)

refs https://github.com/TryGhost/Team/issues/3034

- passes pintura editor config to Koenig lexical editor, allowing integrating it with lexical cards like image and product.
---
 .../app/components/koenig-lexical-editor.js   | 57 ++++++++++++++++++-
 1 file changed, 56 insertions(+), 1 deletion(-)

diff --git a/ghost/admin/app/components/koenig-lexical-editor.js b/ghost/admin/app/components/koenig-lexical-editor.js
index 1100eb0e07..5d6d379799 100644
--- a/ghost/admin/app/components/koenig-lexical-editor.js
+++ b/ghost/admin/app/components/koenig-lexical-editor.js
@@ -129,10 +129,65 @@ export default class KoenigLexicalEditor extends Component {
     @service ghostPaths;
     @service session;
     @service store;
+    @service settings;
 
     @inject config;
     offers = null;
 
+    get pinturaJsUrl() {
+        if (!this.settings.pintura) {
+            return null;
+        }
+        return this.config.pintura?.js || this.settings.pinturaJsUrl;
+    }
+
+    get pinturaCSSUrl() {
+        if (!this.settings.pintura) {
+            return null;
+        }
+        return this.config.pintura?.css || this.settings.pinturaCssUrl;
+    }
+
+    get pinturaConfig() {
+        const jsUrl = this.getImageEditorJSUrl();
+        const cssUrl = this.getImageEditorCSSUrl();
+        if (!this.feature.imageEditor || !jsUrl || !cssUrl) {
+            return null;
+        }
+        return {
+            jsUrl,
+            cssUrl
+        };
+    }
+
+    getImageEditorJSUrl() {
+        let importUrl = this.pinturaJsUrl;
+
+        if (!importUrl) {
+            return null;
+        }
+
+        // load the script from admin root if relative
+        if (importUrl.startsWith('/')) {
+            importUrl = window.location.origin + this.ghostPaths.adminRoot.replace(/\/$/, '') + importUrl;
+        }
+        return importUrl;
+    }
+
+    getImageEditorCSSUrl() {
+        let cssImportUrl = this.pinturaCSSUrl;
+
+        if (!cssImportUrl) {
+            return null;
+        }
+
+        // load the css from admin root if relative
+        if (cssImportUrl.startsWith('/')) {
+            cssImportUrl = window.location.origin + this.ghostPaths.adminRoot.replace(/\/$/, '') + cssImportUrl;
+        }
+        return cssImportUrl;
+    }
+
     @action
     onError(error) {
         // ensure we're still showing errors in development
@@ -198,7 +253,7 @@ export default class KoenigLexicalEditor extends Component {
             fetchEmbed: fetchEmbed,
             fetchAutocompleteLinks
         };
-        const cardConfig = Object.assign({}, defaultCardConfig, props.cardConfig);
+        const cardConfig = Object.assign({}, defaultCardConfig, props.cardConfig, {pinturaConfig: this.pinturaConfig});
 
         const useFileUpload = (type = 'image') => {
             const [progress, setProgress] = React.useState(0);