Page MenuHomeSealhub
Files F10359882

No OneTemporary
Actions

View Options

diff --git a/admin-panel/body-page-editor/body-page-editor.jsx b/admin-panel/body-page-editor/body-page-editor.jsx
index f3bccbb..a6c5381 100644
--- a/admin-panel/body-page-editor/body-page-editor.jsx
+++ b/admin-panel/body-page-editor/body-page-editor.jsx
@@ -1,109 +1,108 @@
const React = require('react');
const useState = React.useState;
const ElementEditor = require('./element-editor.jsx');
const Preview = require('./preview.jsx');
const SelectComponent = require('./select-component.jsx');
-function addElement(elements, componentToCreate, onChange) {
- onChange(elements.concat([[componentToCreate, {}]]));
+function addElement(elements, componentToCreate) {
+ return elements.concat([[componentToCreate, {}]]);
}
-function removeElement(elements, index, onChange) {
+function removeElement(elements, index) {
elements.splice(index, 1);
- onChange([...elements]);
+ return [...elements];
}
-function changeElementPosition(elements, index, offset, onChange) {
+function changeElementPosition(elements, index, offset) {
elements.splice(
- Math.min(Math.max(index + offset, 0), elements.length),
+ minmax(0, elements.length, index + offset),
0,
elements.splice(index, 1)[0]
);
- onChange([...elements]);
+
+ return [...elements];
}
-function setElementProps(elements, index, newProps, onChange) {
+function setElementProps(elements, index, newProps) {
elements[index][1] = newProps;
- onChange([...elements]);
+ return [...elements];
+}
+
+function minmax(min, max, value) {
+ return Math.min(Math.max(value, min), max);
}
module.exports = function bodyPageEditor({ value: elements, onChange }) {
const [componentToCreate, setComponentToCreate] = useState(null);
if (elements === '') elements = [];
return (
<React.Fragment>
<div style={{ display: 'flex', flexFlow: 'column' }}>
{elements.map(([componentName, componentProps], index) => (
<div
key={index}
style={{ display: 'flex', flexFlow: 'row' }}
>
<ElementEditor
componentName={componentName}
componentProps={componentProps}
onChange={newProps =>
- setElementProps(
- elements,
- index,
- newProps,
- onChange
+ onChange(
+ setElementProps(elements, index, newProps)
)
}
/>
<button
- onClick={() => {
- removeElement(elements, index, onChange);
+ onClick={e => {
+ e.preventDefault();
+ onChange(removeElement(elements, index));
}}
>
Remove element
</button>
<button
- onClick={() => {
- changeElementPosition(
- elements,
- index,
- -1,
- onChange
+ onClick={e => {
+ e.preventDefault();
+ onChange(
+ changeElementPosition(elements, index, -1)
);
}}
>
Move up ↑
</button>
<button
- onClick={() => {
- changeElementPosition(
- elements,
- index,
- 1,
- onChange
+ onClick={e => {
+ e.preventDefault();
+ onChange(
+ changeElementPosition(elements, index, 1)
);
}}
>
Move down ↓
</button>
</div>
))}
<Preview elements={elements} />
</div>
<div>{JSON.stringify(elements)}</div>
<SelectComponent
value={componentToCreate || ''}
onChange={setComponentToCreate}
/>
<button
disabled={!componentToCreate}
onClick={e => {
e.preventDefault();
- addElement(elements, componentToCreate, onChange);
+ onChange(addElement(elements, componentToCreate));
}}
>
Add element
</button>
</React.Fragment>
);
};

File Metadata

Mime Type
text/x-diff
Expires
Sat, Nov 8, 02:45 (13 h, 45 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
1033186
Default Alt Text
(3 KB)

Event Timeline