From 41576d2dc32ebcf96745886767e8542251a94127 Mon Sep 17 00:00:00 2001
From: Ronald Langeveld <hi@ronaldlangeveld.com>
Date: Tue, 26 Sep 2023 08:57:01 +0700
Subject: [PATCH] Fixed Pintura url not handling relative config url on import
 (#18343)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

no issue

- Fixed the Pintura hook not handling relative urls passed to it from the config.

---

<!-- Leave the line below if you'd like GitHub Copilot to generate a
summary from your commit -->
<!--
copilot:summary
-->
### <samp>🤖 Generated by Copilot at 2be0e30</samp>

Fixed Pintura asset loading from subdirectories by using the admin root
path. Updated `usePinturaEditor` hook to import and use a helper
function for getting Ghost paths.
---
 apps/admin-x-settings/src/hooks/usePinturaEditor.ts | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/apps/admin-x-settings/src/hooks/usePinturaEditor.ts b/apps/admin-x-settings/src/hooks/usePinturaEditor.ts
index 846454b7b7..a66534fc4b 100644
--- a/apps/admin-x-settings/src/hooks/usePinturaEditor.ts
+++ b/apps/admin-x-settings/src/hooks/usePinturaEditor.ts
@@ -1,6 +1,7 @@
 import * as Sentry from '@sentry/react';
 import {Config} from '../api/config';
 import {Setting} from '../api/settings';
+import {getGhostPaths} from '../utils/helpers';
 import {getSettingValues} from '../api/settings';
 import {useCallback, useEffect, useState} from 'react';
 import {useGlobalData} from '../components/providers/GlobalDataProvider';
@@ -71,10 +72,17 @@ export default function usePinturaEditor({
         };
         let jsUrl = pinturaJsUrl();
 
+        // load the script from admin root if relative
         if (!jsUrl) {
             return;
         }
 
+        // load the script from admin root if relative
+        if (jsUrl.startsWith('/')) {
+            const {adminRoot} = getGhostPaths();
+            jsUrl = window.location.origin + adminRoot.replace(/\/$/, '') + jsUrl;
+        }
+
         if (window.pintura) {
             setScriptLoaded(true);
             return;
@@ -109,6 +117,11 @@ export default function usePinturaEditor({
             return;
         }
 
+        if (cssUrl.startsWith('/')) {
+            const {adminRoot} = getGhostPaths();
+            cssUrl = window.location.origin + adminRoot.replace(/\/$/, '') + cssUrl;
+        }
+
         try {
             // Check if the CSS file is already present in the document's head
             let cssLink = document.querySelector(`link[href="${cssUrl}"]`);