Fix issue with duplicating components not replacing IDs on component itself

This commit is contained in:
Andrew Kingston 2022-09-06 09:21:16 +01:00
parent ce89edda48
commit 562576fb83
3 changed files with 33 additions and 34 deletions

View File

@ -182,16 +182,13 @@ export const makeComponentUnique = component => {
// Replace component ID // Replace component ID
const oldId = component._id const oldId = component._id
const newId = Helpers.uuid() const newId = Helpers.uuid()
component._id = newId let definition = JSON.stringify(component)
if (component._children?.length) { // Replace all instances of this ID in HBS bindings
let children = JSON.stringify(component._children) definition = definition.replace(new RegExp(oldId, "g"), newId)
// Replace all instances of this ID in child HBS bindings // Replace all instances of this ID in JS bindings
children = children.replace(new RegExp(oldId, "g"), newId) const bindings = findHBSBlocks(definition)
// Replace all instances of this ID in child JS bindings
const bindings = findHBSBlocks(children)
bindings.forEach(binding => { bindings.forEach(binding => {
// JSON.stringify will have escaped double quotes, so we need // JSON.stringify will have escaped double quotes, so we need
// to account for that // to account for that
@ -213,12 +210,14 @@ export const makeComponentUnique = component => {
// A single string replace here is better than a regex as // A single string replace here is better than a regex as
// the binding contains special characters, and we only need // the binding contains special characters, and we only need
// to replace a single instance. // to replace a single instance.
children = children.replace(binding, newBinding) definition = definition.replace(binding, newBinding)
} }
}) })
// Recurse on all children // Recurse on all children
component._children = JSON.parse(children) component = JSON.parse(definition)
component._children.forEach(makeComponentUnique) return {
...component,
_children: component._children?.map(makeComponentUnique),
} }
} }

View File

@ -595,7 +595,7 @@ export const getFrontendStore = () => {
// Make new component unique if copying // Make new component unique if copying
if (!cut) { if (!cut) {
makeComponentUnique(componentToPaste) componentToPaste = makeComponentUnique(componentToPaste)
} }
newComponentId = componentToPaste._id newComponentId = componentToPaste._id
@ -905,7 +905,7 @@ export const getFrontendStore = () => {
} }
// Replace block with ejected definition // Replace block with ejected definition
makeComponentUnique(ejectedDefinition) ejectedDefinition = makeComponentUnique(ejectedDefinition)
const index = parent._children.findIndex(x => x._id === componentId) const index = parent._children.findIndex(x => x._id === componentId)
parent._children[index] = ejectedDefinition parent._children[index] = ejectedDefinition
nextSelectedComponentId = ejectedDefinition._id nextSelectedComponentId = ejectedDefinition._id

View File

@ -38,7 +38,7 @@
let duplicateScreen = Helpers.cloneDeep(screen) let duplicateScreen = Helpers.cloneDeep(screen)
delete duplicateScreen._id delete duplicateScreen._id
delete duplicateScreen._rev delete duplicateScreen._rev
makeComponentUnique(duplicateScreen.props) duplicateScreen.props = makeComponentUnique(duplicateScreen.props)
// Attach the new name and URL // Attach the new name and URL
duplicateScreen.routing.route = sanitizeUrl(screenUrl) duplicateScreen.routing.route = sanitizeUrl(screenUrl)