Commit e65f5d57 authored by Max Reeves's avatar Max Reeves
Browse files

Ability to clone Elements

parent b0ac7e43
......@@ -46,6 +46,8 @@ const dashboardReducer = (state, action) => {
};
case 'deleteElement':
console.log('Deleting element')
case 'duplicateElement':
console.log('Duplicating element')
case 'updateElement':
console.log('Updating element')
const newState = {...state};
......@@ -378,6 +380,15 @@ function SidePanelElements({dashboard, dashboardDispatch, setHighlightedElementI
});
};
const duplicateElement = (e, index) => {
e.preventDefault();
let elements = dashboard.elements;
elements.splice(index, 0, elements[index])
dashboardDispatch({
type: 'duplicateElement',
});
};
const handleDragStart = e => {
e.dataTransfer.setData("source-id", e.target.id);
}
......@@ -400,6 +411,7 @@ function SidePanelElements({dashboard, dashboardDispatch, setHighlightedElementI
<div class="element-title">{element.title}</div>
</div>
<button onClick={e => deleteElement(e,index)}>Delete</button>
<button onClick={e => duplicateElement(e,index)}>Duplicate</button>
<div class="drop-zone" onDrop={handleDrop} id={index}
onDragEnter={e => {e.preventDefault(); e.currentTarget.classList.add('active')}}
onDragOver={e => e.preventDefault()}
......
......@@ -178,7 +178,7 @@ label~input, label~select, label~textarea {
margin-bottom: 15px;
}
.element-title {
display: inline-block;
/* display: inline-block; */
padding-right: 6em;
}
......@@ -190,6 +190,8 @@ button {
padding: 10px 20px;
font-size: 16px;
color: var(--color-white);
margin-right: 5px;
display: inline-block;
}
button:hover, button:focus {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment