MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Allow quick duplicating via ctrl/cmd + drag

This commit is contained in:
Andrew Kingston 2024-08-14 11:21:59 +01:00
parent b62371d1be
commit a755fe7630
No known key found for this signature in database
4 changed files with 25 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/AppPreview.svelte
View File

@ -144,7 +144,12 @@
const rootComponent = get(selectedScreen).props const rootComponent = get(selectedScreen).props
const component = findComponent(rootComponent, data.id) const component = findComponent(rootComponent, data.id)
componentStore.copy(component) componentStore.copy(component)
await componentStore.paste(component) await componentStore.paste(
component,
data.mode,
null,
data.selectComponent
)
} else if (type === "preview-loaded") { } else if (type === "preview-loaded") {
// Wait for this event to show the client library if intelligent // Wait for this event to show the client library if intelligent
// loading is supported // loading is supported

15
packages/builder/src/stores/builder/components.js
View File

@ -653,7 +653,7 @@ export class ComponentStore extends BudiStore {
* @param {object} targetScreen * @param {object} targetScreen
* @returns * @returns
*/ */
async paste(targetComponent, mode, targetScreen) { async paste(targetComponent, mode, targetScreen, selectComponent = true) {
const state = get(this.store) const state = get(this.store)
if (!state.componentToPaste) { if (!state.componentToPaste) {
return return
@ -728,12 +728,13 @@ export class ComponentStore extends BudiStore {
await screenStore.patch(patch, targetScreenId) await screenStore.patch(patch, targetScreenId)
// Select the new component // Select the new component
this.update(state => { if (selectComponent) {
state.selectedScreenId = targetScreenId this.update(state => {
state.selectedComponentId = newComponentId state.selectedScreenId = targetScreenId
state.selectedComponentId = newComponentId
return state return state
}) })
}
componentTreeNodesStore.makeNodeVisible(newComponentId) componentTreeNodesStore.makeNodeVisible(newComponentId)
} }

5
packages/client/src/components/preview/GridDNDHandler.svelte
View File

@ -120,6 +120,11 @@
id = component.dataset.id id = component.dataset.id
} }
// If holding ctrl/cmd then leave behind a duplicate of this component
if (mode === GridDragModes.Move && (e.ctrlKey || e.metaKey)) {
builderStore.actions.duplicateComponent(id, "above", false)
}
// Find grid parent and read from DOM // Find grid parent and read from DOM
const domComponent = document.getElementsByClassName(id)[0] const domComponent = document.getElementsByClassName(id)[0]
const domGrid = domComponent?.closest(".grid") const domGrid = domComponent?.closest(".grid")

8
packages/client/src/stores/builder.js
View File

@ -49,8 +49,12 @@ const createBuilderStore = () => {
keyDown: (key, ctrlKey) => { keyDown: (key, ctrlKey) => {
eventStore.actions.dispatchEvent("key-down", { key, ctrlKey }) eventStore.actions.dispatchEvent("key-down", { key, ctrlKey })
}, },
duplicateComponent: id => { duplicateComponent: (id, mode = "below", selectComponent = true) => {
eventStore.actions.dispatchEvent("duplicate-component", { id }) eventStore.actions.dispatchEvent("duplicate-component", {
id,
mode,
selectComponent,
})
}, },
deleteComponent: id => { deleteComponent: id => {
eventStore.actions.dispatchEvent("delete-component", { id }) eventStore.actions.dispatchEvent("delete-component", { id })