WIP: Fix further occurrences of server resources

neos · Jul 8, 2024 · aea8e7c · aea8e7c
1 parent b59545e
commit aea8e7c
Show file tree

Hide file tree

Showing 4 changed files with 35 additions and 8 deletions.
diff --git a/packages/neos-ui-editors/src/EditorEnvelope/index.js b/packages/neos-ui-editors/src/EditorEnvelope/index.js
@@ -9,12 +9,15 @@ import I18n from '@neos-project/neos-ui-i18n';
 import {neos} from '@neos-project/neos-ui-decorators';
 
 import style from './style.module.css';
+import {ResourceIconContext} from '@neos-project/react-ui-components/src/Icon/resourceIcon';
 
 @neos(globalRegistry => ({
     editorRegistry: globalRegistry.get('inspector').get('editors'),
     i18nRegistry: globalRegistry.get('i18n')
 }))
 export default class EditorEnvelope extends PureComponent {
+    static contextType = ResourceIconContext;
+
     state = {
         showHelpMessage: false
     };
@@ -118,11 +121,30 @@ export default class EditorEnvelope extends PureComponent {
     };
 
     getThumbnailSrc(thumbnail) {
-        if (thumbnail.substr(0, 11) === 'resource://') {
-            thumbnail = '/_Resources/Static/Packages/' + thumbnail.substr(11);
+        const regex = /^resource:\/\/([^\\/]+)\/(.*)/;
+
+        const matches = thumbnail?.match(regex);
+
+        if (!matches) {
+            return thumbnail;
+        }
+
+        if (!this.context) {
+            console.error('ResourceIconContext missing! Cannot resolve uri: ', thumbnail);
+            return null;
         }
 
-        return thumbnail;
+        const [_, packageName, rawPath] = matches;
+
+        let publicPath = rawPath;
+        if (!rawPath.startsWith('Public/')) {
+            // legacy syntax not including the "Public" segment see https://github.com/neos/neos-ui/issues/2092#issuecomment-1606055787
+            publicPath = `Public/${rawPath}`;
+        }
+
+        const resourcePath = `resource://${packageName}/${publicPath}`;
+
+        return this.context.createFromResourcePath(resourcePath);
     }
 
     renderHelpMessage() {
@@ -134,7 +156,7 @@ export default class EditorEnvelope extends PureComponent {
         return (
             <Tooltip renderInline className={style.envelope__helpmessage}>
                 {helpMessage ? <ReactMarkdown children={translatedHelpMessage} linkTarget="_blank" /> : ''}
-                {helpThumbnail ? <img alt={label} src={helpThumbnailSrc} className={style.envelope__helpThumbnail} /> : ''}
+                {helpThumbnailSrc ? <img alt={label} src={helpThumbnailSrc} className={style.envelope__helpThumbnail} /> : ''}
             </Tooltip>
         );
     }

diff --git a/packages/neos-ui-editors/src/Editors/Image/Components/PreviewScreen/index.js b/packages/neos-ui-editors/src/Editors/Image/Components/PreviewScreen/index.js
@@ -6,8 +6,11 @@ import {AssetUpload} from '../../../../Library/index';
 import {Thumbnail} from '../../Utils/index';
 import {Icon} from '@neos-project/react-ui-components';
 import style from './style.module.css';
+import {ResourceIconContext} from '@neos-project/react-ui-components/src/Icon/resourceIcon';
 
 export default class PreviewScreen extends PureComponent {
+    static contextType = ResourceIconContext;
+
     static propTypes = {
         className: PropTypes.string,
         propertyName: PropTypes.string,
@@ -52,7 +55,7 @@ export default class PreviewScreen extends PureComponent {
                         </div>
                         <img
                             className={(thumbnail ? style.cropArea__image : style['cropArea__image--placeholder'])}
-                            src={thumbnail ? thumbnail.uri : '/_Resources/Static/Packages/Neos.Neos/Images/dummy-image.svg'}
+                            src={thumbnail ? thumbnail.uri : this.context.createFromResourcePath('resource://Neos.Neos/Public/Images/dummy-image.svg')}
                             style={thumbnail ? thumbnail.styles.thumbnail : {}}
                             alt={propertyName}
                             />

diff --git a/packages/neos-ui-editors/src/SecondaryEditors/ImageCropper/index.js b/packages/neos-ui-editors/src/SecondaryEditors/ImageCropper/index.js
@@ -11,6 +11,7 @@ import CropConfiguration, {CustomAspectRatioOption, LockedAspectRatioStrategy} f
 import style from './style.module.css';
 
 import './react_crop.vanilla-css';
+import {ResourceIconContext} from '@neos-project/react-ui-components/src/Icon/resourceIcon';
 
 /**
  * Calculates the greatest common divisor for given numbers a, b
@@ -74,6 +75,8 @@ class AspectRatioItem extends PureComponent {
     i18nRegistry: globalRegistry.get('i18n')
 }))
 export default class ImageCropper extends PureComponent {
+    static contextType = ResourceIconContext;
+
     state = {
         cropConfiguration: CropConfiguration.fromNeosConfiguration(
             this.props.sourceImage,
@@ -176,7 +179,7 @@ export default class ImageCropper extends PureComponent {
         const aspectRatioLocked = cropConfiguration.aspectRatioStrategy instanceof LockedAspectRatioStrategy;
         const allowCustomRatios = cropConfiguration.aspectRatioOptions.some(option => option instanceof CustomAspectRatioOption);
         const {sourceImage, i18nRegistry} = this.props;
-        const src = sourceImage.previewUri || '/_Resources/Static/Packages/Neos.Neos/Images/dummy-image.svg';
+        const src = sourceImage.previewUri || this.context.createFromResourcePath('resource://Neos.Neos/Public/Images/dummy-image.svg');
 
         const toolbarRef = el => {
             this.toolbarNode = el;

diff --git a/packages/react-ui-components/src/Icon/resourceIcon.tsx b/packages/react-ui-components/src/Icon/resourceIcon.tsx
@@ -25,8 +25,6 @@ class ResourceIcon extends PureComponent<ResourceIconProps> {
     public render(): JSX.Element | null {
         const {padded, theme, label, icon, className, color, size} = this.props;
 
-
-
         if (!this.context) {
             console.error('ResourceIconContext missing! Cannot resolve uri: ', icon);
             return null;
@@ -43,6 +41,7 @@ class ResourceIcon extends PureComponent<ResourceIconProps> {
 
         let publicPath = rawPath;
         if (!rawPath.startsWith('Public/')) {
+            // legacy syntax not including the "Public" segment see https://github.com/neos/neos-ui/issues/2092#issuecomment-1606055787
             publicPath = `Public/${rawPath}`;
         }