Elgato_dark/ToolJet
1
0
Fork 0
mirror of https://github.com/ToolJet/ToolJet synced 2026-05-24 01:18:23 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Merge pull request #11106 from ToolJet/fix-refactor-focus-copy-paste

Browse source 
Prevent pasting if the parent subcontainer was deleted during a cut operation
This commit is contained in:
Johnson Cherian 2024-10-25 10:03:37 +05:30 committed by GitHub
commit 643133c2b1
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 13 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
frontend/src/AppBuilder/AppCanvas/HotkeyProvider.jsx
View file

@ -18,8 +18,8 @@ export const HotkeyProvider = ({ children, mode, currentLayout, canvasMaxWidth }
const enableReleasedVersionPopupState = useStore((state) => state.enableReleasedVersionPopupState, shallow);
const clearSelectedComponents = useStore((state) => state.clearSelectedComponents, shallow);
const getSelectedComponents = useStore((state) => state.getSelectedComponents, shallow);
const undoRef = useHotkeys('meta+z, control+z', handleUndo, { enabled: mode === 'edit' });
const redoRef = useHotkeys('meta+shift+z, control+shift+z', handleRedo, { enabled: mode === 'edit' });
useHotkeys('meta+z, control+z', handleUndo, { enabled: mode === 'edit' });
useHotkeys('meta+shift+z, control+shift+z', handleRedo, { enabled: mode === 'edit' });
const paste = async () => {
if (isContainerFocused && navigator.clipboard && typeof navigator.clipboard.readText === 'function') {

15
frontend/src/AppBuilder/AppCanvas/appCanvasUtils.js
View file

@ -187,7 +187,6 @@ export function computeComponentName(componentType, currentComponents) {
export const getAllChildComponents = (allComponents, parentId) => {
const childComponents = [];
Object.keys(allComponents).forEach((componentId) => {
const componentParentId = allComponents[componentId].component?.parent;
@ -198,7 +197,7 @@ export const getAllChildComponents = (allComponents, parentId) => {
if (componentParentId && isParentTabORCalendar) {
let childComponent = deepClone(allComponents[componentId]);
childComponent.componentId = componentId;
childComponent.id = componentId;
const childTabId = componentParentId.split('-').at(-1);
if (componentParentId === `${parentId}-${childTabId}`) {
childComponent.isParentTabORCalendar = true;
@ -211,7 +210,7 @@ export const getAllChildComponents = (allComponents, parentId) => {
if (componentParentId === parentId) {
let childComponent = deepClone(allComponents[componentId]);
childComponent.componentId = componentId;
childComponent.id = componentId;
childComponents.push(childComponent);
// Recursively find children of the current child component
@ -312,7 +311,10 @@ const updateComponentLayout = (components, parentId, isCut = false) => {
let _components = deepClone(components);
_components.forEach((component, index) => {
Object.keys(component.layouts).map((layout) => {
if ((parentId !== undefined && !component?.component?.parent) || component?.component?.parent === parentId) {
if (
(parentId !== undefined && !component?.component?.parent) ||
(component?.component?.parent === parentId && !isCut)
) {
if (index > 0) {
component.layouts[layout].top = prevComponent.layouts[layout].top + prevComponent.layouts[layout].height;
component.layouts[layout].left = 0;
@ -347,11 +349,14 @@ export function pasteComponents(parentId, copiedComponentObj) {
const components = useStore.getState().getCurrentPageComponents();
const currentPageId = useStore.getState().getCurrentPageId();
const { isCut = false, newComponents: pastedComponents = [], pageId, isCloning = false } = copiedComponentObj;
// Prevent pasting if the parent subcontainer was deleted during a cut operation
if (parentId && !Object.keys(components).find((key) => parentId === key)) {
return;
}
if (parentId) {
const id = Object.keys(components).filter((key) => parentId.startsWith(key));
parentComponent = components[id];
}
pastedComponents.forEach((component) => {
const newComponentId = isCut ? component.id : uuidv4();
const componentName = computeComponentName(component.component.component, {

2
frontend/src/AppBuilder/_stores/slices/componentsSlice.js
View file

@ -796,7 +796,7 @@ export const createComponentsSlice = (set, get) => ({
toDeleteComponents.push(componentId);
// Find the children of this component
const children = getAllChildComponents(allComponents, componentId).map((child) => child.componentId);
const children = getAllChildComponents(allComponents, componentId).map((child) => child.id);
if (children.length > 0) {
// Recursively find children of children
children.forEach((child) => {