Skip to content

Commit

Permalink
Merge remote-tracking branch 'origin/8.2' into 8.3
Browse files Browse the repository at this point in the history
  • Loading branch information
mhsdesign committed Jun 26, 2023
2 parents 7ea5dd7 + cef84f1 commit 5e16758
Show file tree
Hide file tree
Showing 22 changed files with 269 additions and 62 deletions.
3 changes: 2 additions & 1 deletion Classes/Domain/Model/Changes/AbstractCreate.php
Expand Up @@ -19,6 +19,7 @@
use Neos\Neos\Ui\Domain\Model\Feedback\Operations\UpdateNodeInfo;
use Neos\Neos\Ui\Exception\InvalidNodeCreationHandlerException;
use Neos\Neos\Ui\NodeCreationHandler\NodeCreationHandlerInterface;
use Neos\Utility\PositionalArraySorter;

abstract class AbstractCreate extends AbstractStructuralChange
{
Expand Down Expand Up @@ -175,7 +176,7 @@ protected function applyNodeCreationHandlers(NodeInterface $node)
if (isset($nodeType->getOptions()['nodeCreationHandlers'])) {
$nodeCreationHandlers = $nodeType->getOptions()['nodeCreationHandlers'];
if (is_array($nodeCreationHandlers)) {
foreach ($nodeCreationHandlers as $nodeCreationHandlerConfiguration) {
foreach ((new PositionalArraySorter($nodeCreationHandlers))->toArray() as $nodeCreationHandlerConfiguration) {
$nodeCreationHandler = new $nodeCreationHandlerConfiguration['nodeCreationHandler']();
if (!$nodeCreationHandler instanceof NodeCreationHandlerInterface) {
throw new InvalidNodeCreationHandlerException(sprintf('Expected NodeCreationHandlerInterface but got "%s"', get_class($nodeCreationHandler)), 1364759956);
Expand Down
18 changes: 18 additions & 0 deletions Resources/Private/Translations/en/Main.xlf
Expand Up @@ -350,6 +350,24 @@
<trans-unit id="rangeEditorCurrentValue" xml:space="preserve">
<source>Current value</source>
</trans-unit>
<trans-unit id="errorBoundary.copyTechnicalDetails" xml:space="preserve">
<source>Copy technical details</source>
</trans-unit>
<trans-unit id="errorBoundary.technicalDetailsCopied" xml:space="preserve">
<source>Technical details copied</source>
</trans-unit>
<trans-unit id="errorBoundary.reloadUi" xml:space="preserve">
<source>Reload Neos UI</source>
</trans-unit>
<trans-unit id="errorBoundary.title" xml:space="preserve">
<source>Sorry, but the Neos UI could not recover from this error.</source>
</trans-unit>
<trans-unit id="errorBoundary.description" xml:space="preserve">
<source>Please reload the application, or contact your system administrator with the given details.</source>
</trans-unit>
<trans-unit id="errorBoundary.footer" xml:space="preserve">
<source>For more information about the error please refer to the JavaScript console.</source>
</trans-unit>
</body>
</file>
</xliff>
11 changes: 10 additions & 1 deletion Tests/IntegrationTests/Fixtures/1Dimension/imageEditor.e2e.js
Expand Up @@ -20,10 +20,19 @@ test('Can crop an image', async t => {
await t
.click(imageEditor.findReact('IconButton').withProps('icon', 'crop'));
const initialTopOffset = await imageEditor.find('img').getStyleProperty('top');

// Crop the image
await t.drag(ReactSelector('ReactCrop'), 50, 50, {offsetX: 5, offsetY: 5});

// Verify that there's no z-index interference between the secondary
// inspector and the "unapplied changes"-overlay
await t.click(ReactSelector('SecondaryInspector'));
await t.expect(Selector("#neos-UnappliedChangesDialog").exists).notOk();

await t
.drag(ReactSelector('ReactCrop'), 50, 50, {offsetX: 5, offsetY: 5})
.expect(imageEditor.find('img').getStyleProperty('top')).notEql(initialTopOffset, 'The preview image should reflect the cropping results')
.click(Selector('#neos-Inspector-Apply'));

await Page.waitForIframeLoading(t);
await t.switchToIframe('[name="neos-content-main"]');
await t.expect(Selector('.test-page-image').getAttribute('src')).notEql(initialImage, 'Header image should have changed after crop');
Expand Down
12 changes: 6 additions & 6 deletions cssVariables.css
Expand Up @@ -24,28 +24,28 @@
--transition-Default: .25s;
--transition-Slow: .5s;
--zIndex-SecondaryToolbar-LinkIconButtonFlyout: 1;
--zIndex-FlashMessageContainer: 60;
--zIndex-FlashMessageContainer: 70;
--zIndex-LoadingIndicatorContainer: 50;
--zIndex-SecondaryInspector-Context: 1;
--zIndex-SecondaryInspector-Iframe: 2;
--zIndex-SecondaryInspector-Close: 3;
--zIndex-SecondaryInspectorElevated-Context: 1;
--zIndex-SecondaryInspectorElevated-DropdownContents: 2;
--zIndex-Dialog-Context: 1;
--zIndex-SecondaryInspectorElevated: 60;
--zIndex-SecondaryInspectorElevated-DropdownContents: 70;
--zIndex-Dialog: 55;
--zIndex-FullScreenClose-Context: 1;
--zIndex-Drawer: 45;
--zIndex-Bar-Context: 1;
--zIndex-PrimaryToolbar: 40;
--zIndex-CheckboxInput-Context: 1;
--zIndex-DropdownContents-Context: 1;
--zIndex-SelectBoxContents: 40;
--zIndex-SelectBoxContents: 55;
--zIndex-NotInlineEditableOverlay-Context: 1;
--zIndex-CalendarFakeInputMirror-Context: 1;
--zIndex-RdtPicker-Context: 1;
--zIndex-SideBar-DropTargetBefore: 1;
--zIndex-SideBar-DropTargetAfter: 2;
--zIndex-WrapperDropdown-Context: 1;
--zIndex-UnappliedChangesOverlay-Context: 1;
--zIndex-UnappliedChangesOverlay: 55;
--zIndex-NodeToolBar: 2147483646;
--fontSize-Base: 14px;
--fontSize-Small: 12px;
Expand Down
1 change: 1 addition & 0 deletions packages/neos-ts-interfaces/src/index.ts
Expand Up @@ -191,6 +191,7 @@ export interface NodeType {
[propName: string]: {
type?: string;
ui?: {
hidden?: boolean | string;
label?: string;
editor?: string;
editorOptions?: {
Expand Down
18 changes: 13 additions & 5 deletions packages/neos-ui-editors/src/Editors/Range/index.js
@@ -1,5 +1,6 @@
import React, {PureComponent} from 'react';
import PropTypes from 'prop-types';
import cx from 'classnames';
import {neos} from '@neos-project/neos-ui-decorators';
import style from './style.module.css';

Expand All @@ -21,7 +22,8 @@ class RangeEditor extends PureComponent {
minLabel: PropTypes.string,
maxLabel: PropTypes.string,
disabled: PropTypes.bool
})
}),
highlight: PropTypes.bool
};

static defaultProps = {
Expand Down Expand Up @@ -60,16 +62,22 @@ class RangeEditor extends PureComponent {

render() {
const options = {...this.constructor.defaultProps.options, ...this.props.options};
const {value} = this.props;
const {value, highlight} = this.props;

return (
<div className={style.rangeEditor + (options.disabled ? ' ' + style.rangeEditorDisabled : '')}>
<div
className={cx(
style.rangeEditor,
options.disabled && style.rangeEditorDisabled,
highlight && style.rangeEditorHighlight,
)}
>
<input
type="range"
min={options.min}
max={options.max}
step={options.step}
value={value}
value={value || ''}
className="slider"
onChange={this.handleChange}
disabled={options.disabled}
Expand All @@ -84,7 +92,7 @@ class RangeEditor extends PureComponent {
type="text"
onKeyPress={this.onKeyPress}
onChange={this.handleChange}
value={value}
value={value || ''}
style={ {width: `${options.max.toString().length}ch`} }
disabled={options.disabled}
/>
Expand Down
4 changes: 4 additions & 0 deletions packages/neos-ui-editors/src/Editors/Range/style.module.css
Expand Up @@ -7,6 +7,10 @@
width: 100%;
border-radius: 2px;
}
.rangeEditor.rangeEditorHighlight input[type='range'] {
box-shadow: 0 0 0 2px var(--colors-Warn);
border-radius: 2px;
}

.rangeEditor input[type='range']::-webkit-slider-thumb {
appearance: none;
Expand Down
Expand Up @@ -33,7 +33,7 @@
.dropDown__contents {
min-width: 160px;
box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
z-index: var(--zIndex-SecondaryInspectorElevated-DropdownContents);
z-index: var(--zIndex-SecondaryInspectorElevated-DropDownContents);
}
.dropDown__item {
height: 40px;
Expand Down
Expand Up @@ -6,7 +6,7 @@
border-bottom-width: 0;
}
.secondaryInspector--isElevated {
z-index: var(--zIndex-SecondaryInspectorElevated-Context);
z-index: var(--zIndex-SecondaryInspectorElevated);
}
.secondaryInspector .close {
position: absolute;
Expand Down
2 changes: 1 addition & 1 deletion packages/neos-ui-sagas/src/UI/Hotkeys/index.js
Expand Up @@ -37,7 +37,7 @@ export function * handleHotkeys({globalRegistry, store}) {

// Pause mousetrap during inline editing
if (action.type === actionTypes.UI.ContentCanvas.SET_CURRENTLY_EDITED_PROPERTY_NAME) {
mousetrapPaused = action.payload.propertyName !== '';
mousetrapPaused = action.payload !== '';
}
}
}
44 changes: 22 additions & 22 deletions packages/neos-ui-views/src/NodeInfoView/style.module.css
Expand Up @@ -2,32 +2,32 @@
margin: 0;
padding: 0;
list-style: none;
}

&__item {
background-color: var(--colors-ContrastDarkest);
padding: 8px 12px;
margin-bottom: 1px;
line-height: 20px;
min-height: 20px;

&:first-child {
border-top-left-radius: 2px;
border-top-right-radius: 2px;
}
.nodeInfoView__item {
background-color: var(--colors-ContrastDarkest);
padding: 8px 12px;
margin-bottom: 1px;
line-height: 20px;
min-height: 20px;

&:last-child {
border-bottom: none;
border-bottom-left-radius: 2px;
border-bottom-right-radius: 2px;
}
&:first-child {
border-top-left-radius: 2px;
border-top-right-radius: 2px;
}

&__title {
font-weight: bold;
&:last-child {
border-bottom: none;
border-bottom-left-radius: 2px;
border-bottom-right-radius: 2px;
}
}

&__content {
font-size: 13px;
color: var(--colors-ContrastBright);
}
.nodeInfoView__title {
font-weight: bold;
}

.nodeInfoView__content {
font-size: 13px;
color: var(--colors-ContrastBright);
}
100 changes: 100 additions & 0 deletions packages/neos-ui/src/Containers/ErrorBoundary/index.tsx
@@ -0,0 +1,100 @@
import React from 'react';
import styles from './style.module.css';

// @ts-ignore
import Logo from '@neos-project/react-ui-components/src/Logo';
import Button from '@neos-project/react-ui-components/src/Button';
import Icon from '@neos-project/react-ui-components/src/Icon';
import {I18nRegistry} from '@neos-project/neos-ts-interfaces';

class ErrorBoundary extends React.Component<
{ children: React.ReactNode, i18nRegistry: I18nRegistry },
{ error: any }
> {
public state = {error: undefined};

public static getDerivedStateFromError(error: any): {error: any} {
return {error};
}

public render(): React.ReactNode {
if (this.state.error !== undefined) {
return <ErrorFallback error={this.state.error} i18nRegistry={this.props.i18nRegistry} />;
}
return this.props.children;
}
}

const CopyTechnicalDetailsButton = (props: { error: any, i18nRegistry: I18nRegistry } ) => {

Check failure on line 28 in packages/neos-ui/src/Containers/ErrorBoundary/index.tsx

View workflow job for this annotation

GitHub Actions / Code style

There should be no space before this paren
const [hasCopied, setCopied] = React.useState(false);

const copyErrorDetails = () => {
setCopied(true);
const error = props.error as Error;
window.navigator.clipboard.writeText(`Name: ${error.name}\n\nMessage: ${error.message}\n\nStacktrace: ${error.stack}`);
};

if (!window.navigator.clipboard || !(props.error instanceof Error)) {
return null;
}

return <Button onClick={copyErrorDetails} isActive={hasCopied}>
{!hasCopied ?
props.i18nRegistry.translate('Neos.Neos.Ui:Main:errorBoundary.copyTechnicalDetails')
: props.i18nRegistry.translate('Neos.Neos.Ui:Main:errorBoundary.technicalDetailsCopied')}
&nbsp; <Icon icon="copy" size="sm"/>
</Button>;
};

const ReloadNeosUiButton = (props: { i18nRegistry: I18nRegistry }) => {
const [isReloading, setReload] = React.useState(false);
const reload = () => {
if (isReloading) {
return;
}
setReload(true);
setTimeout(() => {
document.location.reload();
}, 100);
};

return <Button onClick={reload}>
{props.i18nRegistry.translate('Neos.Neos.Ui:Main:errorBoundary.reloadUi')}
&nbsp; <Icon icon="redo" size="sm" spin={isReloading}/>
</Button>;
};

const ErrorFallback = (props: { error: any, i18nRegistry: I18nRegistry }) => {
return <div className={styles.container}>
<div>
<Logo />
<h1 className={styles.title}>{props.i18nRegistry.translate('Neos.Neos.Ui:Main:errorBoundary.title')}</h1>
<p>{props.i18nRegistry.translate('Neos.Neos.Ui:Main:errorBoundary.description')}</p>

{props.error instanceof Error &&
<>
<p>
Name: {props.error.name || '-'}
</p>
<p>
Message: {props.error.message || '-'}
</p>
<p>Stacktrace:</p>
<pre className={styles.stackTrace}>
<code>
{props.error.stack}
</code>
</pre>
</>
}
<p>{props.i18nRegistry.translate('Neos.Neos.Ui:Main:errorBoundary.footer')}</p>

<div className={styles.buttonGroup}>
<ReloadNeosUiButton i18nRegistry={props.i18nRegistry} />
<CopyTechnicalDetailsButton error={props.error} i18nRegistry={props.i18nRegistry} />
</div>
</div>
</div>;
};

export default ErrorBoundary;
31 changes: 31 additions & 0 deletions packages/neos-ui/src/Containers/ErrorBoundary/style.module.css
@@ -0,0 +1,31 @@
.container {
width: 100%;
min-height: 100vh;
background-color: #222;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
}

.container > * {
flex: 0 1 800px;
margin: var(--spacing-Full);
overflow: auto;
}

.title {
line-height: 1;
}
.stackTrace {
overflow-x: auto;
border-top: 1px solid var(--colors-PrimaryBlue);
border-bottom: 1px solid var(--colors-PrimaryBlue);
padding: var(--spacing-Half) 0;
}

.buttonGroup {
display: flex;
flex-wrap: wrap;
gap: var(--spacing-Half) var(--spacing-Full);
}
Expand Up @@ -44,6 +44,7 @@
margin-right: var(--spacing-Quarter);
resize: vertical;
overflow-y: auto;
z-index: 1;
}
.leftSideBar__top--isFullHeight {
flex: 1;
Expand Down

0 comments on commit 5e16758

Please sign in to comment.