From d996c46c1b7820c27fc4bcaa235865b91f1fb23a Mon Sep 17 00:00:00 2001 From: Balazs Bajorics <2226774+balazsbajorics@users.noreply.github.com> Date: Tue, 29 Oct 2024 16:34:25 +0100 Subject: [PATCH 1/6] Revert "disable pushIntendedBoundsAndUpdateHuggingElements (#5525)" This reverts commit 6aeac40a50d8501fd5fec57e998794c5caaa381a. --- ...d-update-targets-command.spec.browser2.tsx | 8 +- .../editor/actions/actions.spec.browser2.tsx | 164 +++++++++--------- .../editor/conditionals.spec.browser2.tsx | 2 +- editor/src/core/model/true-up-targets.ts | 3 +- 4 files changed, 88 insertions(+), 89 deletions(-) diff --git a/editor/src/components/canvas/commands/push-intended-bounds-and-update-targets-command.spec.browser2.tsx b/editor/src/components/canvas/commands/push-intended-bounds-and-update-targets-command.spec.browser2.tsx index 5a42a32d7d88..3316821f315f 100644 --- a/editor/src/components/canvas/commands/push-intended-bounds-and-update-targets-command.spec.browser2.tsx +++ b/editor/src/components/canvas/commands/push-intended-bounds-and-update-targets-command.spec.browser2.tsx @@ -19,7 +19,7 @@ function makeScenePath(trailingPath: string): ElementPath { describe('push intended bounds', () => { describe('hugging elements', () => { describe('flex containers', () => { - xit('keeps the container dimensions when becoming empty (flex) (delete, single element)', async () => { + it('keeps the container dimensions when becoming empty (flex) (delete, single element)', async () => { const renderResult = await renderTestEditorWithCode( formatTestProjectCode( makeTestProjectCodeWithSnippet(` @@ -74,7 +74,7 @@ describe('push intended bounds', () => { ), ) }) - xit('keeps the container dimensions when becoming empty (flex) (delete, multiple elements)', async () => { + it('keeps the container dimensions when becoming empty (flex) (delete, multiple elements)', async () => { const renderResult = await renderTestEditorWithCode( formatTestProjectCode( makeTestProjectCodeWithSnippet(` @@ -177,7 +177,7 @@ describe('push intended bounds', () => { ), ) }) - xit('keeps the container dimensions when becoming empty (zero-sized)', async () => { + it('keeps the container dimensions when becoming empty (zero-sized)', async () => { const renderResult = await renderTestEditorWithCode( formatTestProjectCode(` import * as React from 'react' @@ -211,7 +211,7 @@ describe('push intended bounds', () => { `), ) }) - xit('keeps the container dimensions when becoming empty (inside a flex container)', async () => { + it('keeps the container dimensions when becoming empty (inside a flex container)', async () => { const renderResult = await renderTestEditorWithCode( formatTestProjectCode(` import * as React from 'react' diff --git a/editor/src/components/editor/actions/actions.spec.browser2.tsx b/editor/src/components/editor/actions/actions.spec.browser2.tsx index 4ea691d27750..608ce1579661 100644 --- a/editor/src/components/editor/actions/actions.spec.browser2.tsx +++ b/editor/src/components/editor/actions/actions.spec.browser2.tsx @@ -421,68 +421,68 @@ describe('actions', () => { `, wantSelection: [makeTargetPath('view/group/child1')], }, - // { - // name: 'delete group child selects next sibling (multiple selection)', - // input: ` - // - // - //
- //
- //
- //
- // - //
- //
- //
- // - // `, - // targets: [makeTargetPath('view/group/child3'), makeTargetPath('view/foo/bar')], - // wantCode: ` - // - // - //
- //
- //
- // - //
- // - // `, - // wantSelection: [makeTargetPath('view/group/child1'), makeTargetPath('view/foo')], - // }, - // { - // name: 'delete last group child deletes the group', - // input: ` - // - // - //
- // - // - // `, - // targets: [makeTargetPath('view/group/child1')], - // wantCode: ` - // - // `, - // wantSelection: [makeTargetPath('view')], - // }, - // { - // name: 'recursively delete empty parents when groups or fragments', - // input: ` - //
- // - // - // - //
- // - // - // - //
- // `, - // targets: [makeTargetPath(`root/g1/g2/f1/child`)], - // wantCode: ` - //
- // `, - // wantSelection: [makeTargetPath(`root`)], - // }, + { + name: 'delete group child selects next sibling (multiple selection)', + input: ` + + +
+
+
+
+ +
+
+
+ + `, + targets: [makeTargetPath('view/group/child3'), makeTargetPath('view/foo/bar')], + wantCode: ` + + +
+
+
+ +
+ + `, + wantSelection: [makeTargetPath('view/group/child1'), makeTargetPath('view/foo')], + }, + { + name: 'delete last group child deletes the group', + input: ` + + +
+ + + `, + targets: [makeTargetPath('view/group/child1')], + wantCode: ` + + `, + wantSelection: [makeTargetPath('view')], + }, + { + name: 'recursively delete empty parents when groups or fragments', + input: ` +
+ + + +
+ + + +
+ `, + targets: [makeTargetPath(`root/g1/g2/f1/child`)], + wantCode: ` +
+ `, + wantSelection: [makeTargetPath(`root`)], + }, { name: 'recursively delete empty parents when groups or fragments and stops', input: ` @@ -507,26 +507,26 @@ describe('actions', () => { `, wantSelection: [makeTargetPath(`root/g1/stop-here`)], }, - // { - // name: 'recursively delete empty parents when groups or fragments with multiselect', - // input: ` - //
- // - //
- // - // - //
- // - // - // - //
- // `, - // targets: [makeTargetPath(`root/g1/g2/f1/child`), makeTargetPath(`root/g1/delete-me`)], - // wantCode: ` - //
- // `, - // wantSelection: [makeTargetPath(`root`)], - // }, + { + name: 'recursively delete empty parents when groups or fragments with multiselect', + input: ` +
+ +
+ + +
+ + + +
+ `, + targets: [makeTargetPath(`root/g1/g2/f1/child`), makeTargetPath(`root/g1/delete-me`)], + wantCode: ` +
+ `, + wantSelection: [makeTargetPath(`root`)], + }, ] tests.forEach((tt, idx) => { it(`(${idx + 1}) ${tt.name}`, async () => { diff --git a/editor/src/components/editor/conditionals.spec.browser2.tsx b/editor/src/components/editor/conditionals.spec.browser2.tsx index 735968b12e6b..9d6d5d28484d 100644 --- a/editor/src/components/editor/conditionals.spec.browser2.tsx +++ b/editor/src/components/editor/conditionals.spec.browser2.tsx @@ -264,7 +264,7 @@ describe('conditionals', () => { expect(EP.isParentOf(conditionalPath, selectedViews[0])).toBe(true) expect(EP.toUid(selectedViews[0])).not.toBe('ccc') }) - xit('keeps the selection on the null branch (multiple targets)', async () => { + it('keeps the selection on the null branch (multiple targets)', async () => { const startSnippet = `
{ diff --git a/editor/src/core/model/true-up-targets.ts b/editor/src/core/model/true-up-targets.ts index f8b65d15ff01..97bed92fc33c 100644 --- a/editor/src/core/model/true-up-targets.ts +++ b/editor/src/core/model/true-up-targets.ts @@ -77,8 +77,7 @@ export function getCommandsForPushIntendedBounds( return [ pushIntendedBoundsAndUpdateGroups(groupTargets, isStartingMetadata), - // disabling this as the collapsed elements detection is way too agressive and converts too many elements to absolute - // pushIntendedBoundsAndUpdateHuggingElements(huggingElementTargets), + pushIntendedBoundsAndUpdateHuggingElements(huggingElementTargets), ] } From 086a4282e4ee359950dec2d0f29b3af37d4a3051 Mon Sep 17 00:00:00 2001 From: Balazs Bajorics <2226774+balazsbajorics@users.noreply.github.com> Date: Tue, 29 Oct 2024 17:54:15 +0100 Subject: [PATCH 2/6] collapsed hugging parent: never convert to absolute --- ...nds-and-update-hugging-elements-command.ts | 33 +------------------ 1 file changed, 1 insertion(+), 32 deletions(-) diff --git a/editor/src/components/canvas/commands/push-intended-bounds-and-update-hugging-elements-command.ts b/editor/src/components/canvas/commands/push-intended-bounds-and-update-hugging-elements-command.ts index 7b82f99e77c4..8e8088658edb 100644 --- a/editor/src/components/canvas/commands/push-intended-bounds-and-update-hugging-elements-command.ts +++ b/editor/src/components/canvas/commands/push-intended-bounds-and-update-hugging-elements-command.ts @@ -128,39 +128,8 @@ function applyUpdateResizeHuggingElementsCommands( 'height', frameAndTarget.frame.height, ), + showToastCommand('Added fixed width and height', 'NOTICE', 'added-width-height'), // TODO before merge verify this toast shows up ) - - const parentPath = EP.parentPath(frameAndTarget.target) - const parentElement = MetadataUtils.findElementByElementPath(editor.jsxMetadata, parentPath) - const parentIsHugging = - parentElement != null && - (isHuggingParent(parentElement, 'width') || isHuggingParent(parentElement, 'height')) - const shouldSetAbsolutePosition = - EP.isStoryboardPath(parentPath) || parentElement == null || parentIsHugging - if (shouldSetAbsolutePosition) { - commands.push( - setProperty('always', frameAndTarget.target, PP.create('style', 'position'), 'absolute'), - setCSSDimension( - metadata.specialSizeMeasurements.flexDirection, - 'left', - frameAndTarget.frame.x, - ), - setCSSDimension( - metadata.specialSizeMeasurements.flexDirection, - 'top', - frameAndTarget.frame.y, - ), - showToastCommand( - 'Converted to fixed size and absolute position', - 'NOTICE', - 'convert-to-fixed-size', - ), - ) - } else { - commands.push( - showToastCommand('Added fixed width and height', 'NOTICE', 'added-width-height'), - ) - } } } return { From 28caa47a70bccb268b14d66125528a1e45474b9a Mon Sep 17 00:00:00 2001 From: Balazs Bajorics <2226774+balazsbajorics@users.noreply.github.com> Date: Wed, 30 Oct 2024 12:10:19 +0100 Subject: [PATCH 3/6] fixing tests vol 1 --- .../components/editor/actions/actions.spec.browser2.tsx | 8 ++++---- .../src/components/editor/conditionals.spec.browser2.tsx | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/editor/src/components/editor/actions/actions.spec.browser2.tsx b/editor/src/components/editor/actions/actions.spec.browser2.tsx index 608ce1579661..c378be6fb6ac 100644 --- a/editor/src/components/editor/actions/actions.spec.browser2.tsx +++ b/editor/src/components/editor/actions/actions.spec.browser2.tsx @@ -444,7 +444,7 @@ describe('actions', () => {
-
+
`, wantSelection: [makeTargetPath('view/group/child1'), makeTargetPath('view/foo')], @@ -460,7 +460,7 @@ describe('actions', () => { `, targets: [makeTargetPath('view/group/child1')], wantCode: ` - + `, wantSelection: [makeTargetPath('view')], }, @@ -479,7 +479,7 @@ describe('actions', () => { `, targets: [makeTargetPath(`root/g1/g2/f1/child`)], wantCode: ` -
+
`, wantSelection: [makeTargetPath(`root`)], }, @@ -523,7 +523,7 @@ describe('actions', () => { `, targets: [makeTargetPath(`root/g1/g2/f1/child`), makeTargetPath(`root/g1/delete-me`)], wantCode: ` -
+
`, wantSelection: [makeTargetPath(`root`)], }, diff --git a/editor/src/components/editor/conditionals.spec.browser2.tsx b/editor/src/components/editor/conditionals.spec.browser2.tsx index 9d6d5d28484d..3b48b06eb47f 100644 --- a/editor/src/components/editor/conditionals.spec.browser2.tsx +++ b/editor/src/components/editor/conditionals.spec.browser2.tsx @@ -336,7 +336,7 @@ describe('conditionals', () => { null ) } -
+
`), ) From 29fc361ead1669de6aa18ba672426965f2c1e199 Mon Sep 17 00:00:00 2001 From: Balazs Bajorics <2226774+balazsbajorics@users.noreply.github.com> Date: Wed, 30 Oct 2024 12:13:48 +0100 Subject: [PATCH 4/6] Test Update: actually if it was already a collapsed parent, do not give it a size!! --- ...intended-bounds-and-update-targets-command.spec.browser2.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/editor/src/components/canvas/commands/push-intended-bounds-and-update-targets-command.spec.browser2.tsx b/editor/src/components/canvas/commands/push-intended-bounds-and-update-targets-command.spec.browser2.tsx index 3316821f315f..1b041e132812 100644 --- a/editor/src/components/canvas/commands/push-intended-bounds-and-update-targets-command.spec.browser2.tsx +++ b/editor/src/components/canvas/commands/push-intended-bounds-and-update-targets-command.spec.browser2.tsx @@ -205,7 +205,7 @@ describe('push intended bounds', () => { export var storyboard = ( -
+
) `), From e252cad514804172433de32b114953a842c4f655 Mon Sep 17 00:00:00 2001 From: Sean Parsons Date: Thu, 31 Oct 2024 16:00:48 +0000 Subject: [PATCH 5/6] fix(editor) Tuned Auto-Collapse Behaviour. - Moved `getHuggingElementContentsStatus` into its own file and extracted out the type `HuggingElementContentsStatus`. - Changed type of `PushIntendedBoundsAndUpdateHuggingElements.value`. - Added additional escape case in `applyUpdateResizeHuggingElementsCommands`. - `deleteElements` stores some more values upfront in the `trueUpHuggingElement` value. - Added `elementFrame` and `huggingElementContentsStatus` to `TrueUpHuggingElement`. --- ...nds-and-update-hugging-elements-command.ts | 45 ++++++++++--------- ...d-update-targets-command.spec.browser2.tsx | 40 +++++++++++++++++ editor/src/components/canvas/hugging-utils.ts | 26 +++++++++++ .../src/components/editor/actions/actions.tsx | 16 ++++++- .../components/editor/store/editor-state.ts | 7 +++ .../store/store-deep-equality-instances.ts | 9 +++- editor/src/core/model/true-up-targets.ts | 10 ++++- 7 files changed, 127 insertions(+), 26 deletions(-) create mode 100644 editor/src/components/canvas/hugging-utils.ts diff --git a/editor/src/components/canvas/commands/push-intended-bounds-and-update-hugging-elements-command.ts b/editor/src/components/canvas/commands/push-intended-bounds-and-update-hugging-elements-command.ts index 8e8088658edb..842a65ce8208 100644 --- a/editor/src/components/canvas/commands/push-intended-bounds-and-update-hugging-elements-command.ts +++ b/editor/src/components/canvas/commands/push-intended-bounds-and-update-hugging-elements-command.ts @@ -1,3 +1,5 @@ +import type { CanvasRectangle } from '../../../core/shared/math-utils' +import { isFiniteRectangle, sizesEqual } from '../../../core/shared/math-utils' import { MetadataUtils } from '../../../core/model/element-metadata-utils' import * as EP from '../../../core/shared/element-path' import type { ElementInstanceMetadataMap } from '../../../core/shared/element-template' @@ -14,16 +16,23 @@ import type { CanvasFrameAndTarget } from '../canvas-types' import type { BaseCommand, CanvasCommand, CommandFunctionResult } from './commands' import { foldAndApplyCommandsSimple } from './commands' import { setCssLengthProperty, setExplicitCssValue } from './set-css-length-command' -import { setProperty } from './set-property-command' import { showToastCommand } from './show-toast-command' +import { isZeroSizedElement } from '../controls/outline-utils' +import type { HuggingElementContentsStatus } from '../hugging-utils' +import { getHuggingElementContentsStatus } from '../hugging-utils' + +export interface IntendedBoundsAndChildrenState extends CanvasFrameAndTarget { + elementFrame: CanvasRectangle + huggingElementContentsStatus: HuggingElementContentsStatus +} export interface PushIntendedBoundsAndUpdateHuggingElements extends BaseCommand { type: 'PUSH_INTENDED_BOUNDS_AND_UPDATE_HUGGING_ELEMENTS' - value: Array + value: Array } export function pushIntendedBoundsAndUpdateHuggingElements( - value: Array, + value: Array, ): PushIntendedBoundsAndUpdateHuggingElements { return { type: 'PUSH_INTENDED_BOUNDS_AND_UPDATE_HUGGING_ELEMENTS', @@ -60,23 +69,6 @@ export const runPushIntendedBoundsAndUpdateHuggingElements = ( } } -function getHuggingElementContentsStatus( - jsxMetadata: ElementInstanceMetadataMap, - path: ElementPath, -): 'empty' | 'contains-only-absolute' | 'contains-some-absolute' | 'non-empty' { - const children = MetadataUtils.getChildrenUnordered(jsxMetadata, path) - const absoluteChildren = children.filter(MetadataUtils.isPositionAbsolute).length - if (children.length === 0) { - return 'empty' - } else if (absoluteChildren === children.length) { - return 'contains-only-absolute' - } else if (absoluteChildren > 0) { - return 'contains-some-absolute' - } else { - return 'non-empty' - } -} - function applyUpdateResizeHuggingElementsCommands( editor: EditorState, command: PushIntendedBoundsAndUpdateHuggingElements, @@ -89,17 +81,30 @@ function applyUpdateResizeHuggingElementsCommands( editor.jsxMetadata, frameAndTarget.target, ) + + // If the element isn't hugging its parent in either direction, skip this case. if ( metadata == null || !(isHuggingParent(metadata, 'width') || isHuggingParent(metadata, 'height')) ) { continue } + + // If the element still has non-absolute children, skip this case. const status = getHuggingElementContentsStatus(editor.jsxMetadata, frameAndTarget.target) if (status === 'non-empty') { continue } + // If the element is now empty, but used to contain only absolute children, and is zero-sized, skip this case. + if ( + status === 'empty' && + frameAndTarget.huggingElementContentsStatus === 'contains-only-absolute' && + isZeroSizedElement(frameAndTarget.elementFrame) + ) { + continue + } + function setCSSDimension( flexDirection: FlexDirection | null, prop: 'left' | 'top' | 'width' | 'height', diff --git a/editor/src/components/canvas/commands/push-intended-bounds-and-update-targets-command.spec.browser2.tsx b/editor/src/components/canvas/commands/push-intended-bounds-and-update-targets-command.spec.browser2.tsx index 1b041e132812..efdc077b950b 100644 --- a/editor/src/components/canvas/commands/push-intended-bounds-and-update-targets-command.spec.browser2.tsx +++ b/editor/src/components/canvas/commands/push-intended-bounds-and-update-targets-command.spec.browser2.tsx @@ -251,6 +251,46 @@ describe('push intended bounds', () => { `), ) }) + it('keeps the container dimensions when becoming empty (inside a grid container)', async () => { + const renderResult = await renderTestEditorWithCode( + formatTestProjectCode(` + import * as React from 'react' + import { Storyboard, Group } from 'utopia-api' + + export var storyboard = ( + +
+
+
+ delete me pls +
+
+
+
+ ) + `), + 'await-first-dom-report', + ) + + await selectComponentsForTest(renderResult, [EP.fromString(`sb/grid/container/delete-me`)]) + + await renderResult.dispatch([deleteSelected()], true) + + expect(getPrintedUiJsCode(renderResult.getEditorState())).toEqual( + formatTestProjectCode(` + import * as React from 'react' + import { Storyboard, Group } from 'utopia-api' + + export var storyboard = ( + +
+
+
+ + ) + `), + ) + }) }) }) }) diff --git a/editor/src/components/canvas/hugging-utils.ts b/editor/src/components/canvas/hugging-utils.ts new file mode 100644 index 000000000000..c6f552f74976 --- /dev/null +++ b/editor/src/components/canvas/hugging-utils.ts @@ -0,0 +1,26 @@ +import { MetadataUtils } from '../../core/model/element-metadata-utils' +import type { ElementInstanceMetadataMap } from '../../core/shared/element-template' +import type { ElementPath } from '../../core/shared/project-file-types' + +export type HuggingElementContentsStatus = + | 'empty' + | 'contains-only-absolute' + | 'contains-some-absolute' + | 'non-empty' + +export function getHuggingElementContentsStatus( + jsxMetadata: ElementInstanceMetadataMap, + path: ElementPath, +): HuggingElementContentsStatus { + const children = MetadataUtils.getChildrenUnordered(jsxMetadata, path) + const absoluteChildren = children.filter(MetadataUtils.isPositionAbsolute).length + if (children.length === 0) { + return 'empty' + } else if (absoluteChildren === children.length) { + return 'contains-only-absolute' + } else if (absoluteChildren > 0) { + return 'contains-some-absolute' + } else { + return 'non-empty' + } +} diff --git a/editor/src/components/editor/actions/actions.tsx b/editor/src/components/editor/actions/actions.tsx index 090d109b6898..ef6c71998927 100644 --- a/editor/src/components/editor/actions/actions.tsx +++ b/editor/src/components/editor/actions/actions.tsx @@ -637,6 +637,8 @@ import { } from '../../../core/shared/import/proejct-health-check/utopia-requirements-service' import { RequirementResolutionResult } from '../../../core/shared/import/proejct-health-check/utopia-requirements-types' import { applyValuesAtPath, deleteValuesAtPath } from '../../canvas/commands/utils/property-utils' +import type { HuggingElementContentsStatus } from '../../../components/canvas/hugging-utils' +import { getHuggingElementContentsStatus } from '../../../components/canvas/hugging-utils' export const MIN_CODE_PANE_REOPEN_WIDTH = 100 @@ -1092,6 +1094,7 @@ function deleteElements( console.error(`Attempted to delete element(s) with no UI file open.`) return editor } else { + const targetStaticUIDs = targets.map(EP.toStaticUid) const updatedEditor = targets.reduce((working, targetPath) => { const underlyingTarget = normalisePathToUnderlyingTarget(working.projectContents, targetPath) @@ -1151,6 +1154,8 @@ function deleteElements( ? right(metadata.element.value.props) : null + const children = MetadataUtils.getChildrenUnordered(editor.jsxMetadata, path) + const childrenFrame = boundingRectangleArray( mapDropNulls((child) => { @@ -1159,7 +1164,7 @@ function deleteElements( return null } return childFrame - }, MetadataUtils.getChildrenUnordered(editor.jsxMetadata, path)), + }, children), ) ?? canvasRectangle(zeroRectangle) const hasHorizontalPosition = @@ -1179,7 +1184,14 @@ function deleteElements( height: main.height !== 0 ? main.height : backup.height, }) } - return trueUpHuggingElement(path, combineFrames(canvasRectangle(frame), childrenFrame)) + const huggingElementContentsStatus: HuggingElementContentsStatus = + getHuggingElementContentsStatus(editor.jsxMetadata, path) + return trueUpHuggingElement( + path, + canvasRectangle(frame), + combineFrames(canvasRectangle(frame), childrenFrame), + huggingElementContentsStatus, + ) }, uniqBy(targets.map(EP.parentPath), EP.pathsEqual)) trueUps.push(...trueUpHuggingElements) } diff --git a/editor/src/components/editor/store/editor-state.ts b/editor/src/components/editor/store/editor-state.ts index bce7097d5f49..f93ceb93efb9 100644 --- a/editor/src/components/editor/store/editor-state.ts +++ b/editor/src/components/editor/store/editor-state.ts @@ -194,6 +194,7 @@ import { emptyProjectRequirements, type ProjectRequirements, } from '../../../core/shared/import/proejct-health-check/utopia-requirements-types' +import type { HuggingElementContentsStatus } from '../../../components/canvas/hugging-utils' const ObjectPathImmutable: any = OPI @@ -1360,17 +1361,23 @@ export function trueUpChildrenOfGroupChanged( export interface TrueUpHuggingElement { type: 'TRUE_UP_HUGGING_ELEMENT' target: ElementPath + elementFrame: CanvasRectangle frame: CanvasRectangle + huggingElementContentsStatus: HuggingElementContentsStatus } export function trueUpHuggingElement( target: ElementPath, + elementFrame: CanvasRectangle, frame: CanvasRectangle, + huggingElementContentsStatus: HuggingElementContentsStatus, ): TrueUpHuggingElement { return { type: 'TRUE_UP_HUGGING_ELEMENT', target: target, + elementFrame: elementFrame, frame: frame, + huggingElementContentsStatus: huggingElementContentsStatus, } } diff --git a/editor/src/components/editor/store/store-deep-equality-instances.ts b/editor/src/components/editor/store/store-deep-equality-instances.ts index 912ab4eb153c..c9cf33c63057 100644 --- a/editor/src/components/editor/store/store-deep-equality-instances.ts +++ b/editor/src/components/editor/store/store-deep-equality-instances.ts @@ -5089,12 +5089,17 @@ export const TrueUpChildrenOfGroupChangedKeepDeepEquality: KeepDeepEqualityCall< ) export const TrueUpHuggingElementKeepDeepEquality: KeepDeepEqualityCall = - combine2EqualityCalls( + combine4EqualityCalls( (value) => value.target, ElementPathKeepDeepEquality, + (value) => value.elementFrame, + CanvasRectangleKeepDeepEquality, (value) => value.frame, CanvasRectangleKeepDeepEquality, - (target, frame) => trueUpHuggingElement(target, frame), + (value) => value.huggingElementContentsStatus, + createCallWithTripleEquals(), + (target, elementFrame, frame, huggingElementContentsStatus) => + trueUpHuggingElement(target, elementFrame, frame, huggingElementContentsStatus), ) export const TrueUpTargetKeepDeepEquality: KeepDeepEqualityCall = ( diff --git a/editor/src/core/model/true-up-targets.ts b/editor/src/core/model/true-up-targets.ts index 97bed92fc33c..9f576abe504e 100644 --- a/editor/src/core/model/true-up-targets.ts +++ b/editor/src/core/model/true-up-targets.ts @@ -1,6 +1,7 @@ import type { CanvasFrameAndTarget } from '../../components/canvas/canvas-types' import type { PushIntendedBoundsAndUpdateGroups } from '../../components/canvas/commands/push-intended-bounds-and-update-groups-command' import { pushIntendedBoundsAndUpdateGroups } from '../../components/canvas/commands/push-intended-bounds-and-update-groups-command' +import type { IntendedBoundsAndChildrenState } from '../../components/canvas/commands/push-intended-bounds-and-update-hugging-elements-command' import { pushIntendedBoundsAndUpdateHuggingElements, type PushIntendedBoundsAndUpdateHuggingElements, @@ -48,7 +49,7 @@ export function getCommandsForPushIntendedBounds( } let groupTargets: Array = [] - let huggingElementTargets: Array = [] + let huggingElementTargets: Array = [] for (const trueUpTarget of targets) { switch (trueUpTarget.type) { @@ -68,7 +69,12 @@ export function getCommandsForPushIntendedBounds( ) break case 'TRUE_UP_HUGGING_ELEMENT': - huggingElementTargets.push(trueUpTarget) + huggingElementTargets.push({ + target: trueUpTarget.target, + elementFrame: trueUpTarget.elementFrame, + frame: trueUpTarget.frame, + huggingElementContentsStatus: trueUpTarget.huggingElementContentsStatus, + }) break default: assertNever(trueUpTarget) From c3ea88573e0fbb0ad26b0df049e2c6c8ebb7fd0a Mon Sep 17 00:00:00 2001 From: Sean Parsons Date: Thu, 31 Oct 2024 17:30:56 +0000 Subject: [PATCH 6/6] fix(todo) Removed TODO as it can't be tested right now. --- .../push-intended-bounds-and-update-hugging-elements-command.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/editor/src/components/canvas/commands/push-intended-bounds-and-update-hugging-elements-command.ts b/editor/src/components/canvas/commands/push-intended-bounds-and-update-hugging-elements-command.ts index 842a65ce8208..d4cbf9f313af 100644 --- a/editor/src/components/canvas/commands/push-intended-bounds-and-update-hugging-elements-command.ts +++ b/editor/src/components/canvas/commands/push-intended-bounds-and-update-hugging-elements-command.ts @@ -133,7 +133,7 @@ function applyUpdateResizeHuggingElementsCommands( 'height', frameAndTarget.frame.height, ), - showToastCommand('Added fixed width and height', 'NOTICE', 'added-width-height'), // TODO before merge verify this toast shows up + showToastCommand('Added fixed width and height', 'NOTICE', 'added-width-height'), ) } }