Adds selected ids to commands that lack them (#192)

This commit is contained in:
Steve Ruiz 2021-10-22 12:08:02 +01:00 committed by GitHub
parent ff50aa6ad5
commit 918ebef54d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
16 changed files with 190 additions and 11 deletions

View file

@ -58,6 +58,11 @@ export function align(data: Data, ids: string[], type: AlignType): TLDrawCommand
shapes: before,
},
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
},
after: {
@ -67,6 +72,11 @@ export function align(data: Data, ids: string[], type: AlignType): TLDrawCommand
shapes: after,
},
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
},
}

View file

@ -24,6 +24,11 @@ export function distribute(data: Data, ids: string[], type: DistributeType): TLD
pages: {
[currentPageId]: { shapes: before },
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
},
after: {
@ -31,6 +36,11 @@ export function distribute(data: Data, ids: string[], type: DistributeType): TLD
pages: {
[currentPageId]: { shapes: after },
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
},
}

View file

@ -64,6 +64,11 @@ export function flip(data: Data, ids: string[], type: FlipType): TLDrawCommand {
pages: {
[data.appState.currentPageId]: { shapes: before },
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
},
after: {
@ -71,6 +76,11 @@ export function flip(data: Data, ids: string[], type: FlipType): TLDrawCommand {
pages: {
[data.appState.currentPageId]: { shapes: after },
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
},
}

View file

@ -199,7 +199,7 @@ export function group(
},
pageStates: {
[pageId]: {
selectedIds: TLDR.getSelectedIds(data, pageId),
selectedIds: ids,
},
},
},

View file

@ -221,14 +221,24 @@ export function move(data: Data, ids: string[], type: MoveType): TLDrawCommand {
before: {
document: {
pages: {
[data.appState.currentPageId]: { shapes: result.before },
[currentPageId]: { shapes: result.before },
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
},
after: {
document: {
pages: {
[data.appState.currentPageId]: { shapes: result.after },
[currentPageId]: { shapes: result.after },
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
},

View file

@ -2,6 +2,8 @@ import type { Data, TLDrawCommand } from '~types'
import { TLDR } from '~state/tldr'
export function resetBounds(data: Data, ids: string[], pageId: string): TLDrawCommand {
const { currentPageId } = data.appState
const { before, after } = TLDR.mutateShapes(
data,
ids,
@ -16,6 +18,11 @@ export function resetBounds(data: Data, ids: string[], pageId: string): TLDrawCo
pages: {
[data.appState.currentPageId]: { shapes: before },
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
},
after: {
@ -23,6 +30,11 @@ export function resetBounds(data: Data, ids: string[], pageId: string): TLDrawCo
pages: {
[data.appState.currentPageId]: { shapes: after },
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
},
}

View file

@ -40,3 +40,20 @@ describe('Rotate command', () => {
it.todo('Rotates shapes with handles.')
})
describe('when running the command', () => {
it('restores selection on undo', () => {
const tlstate = new TLDrawState()
.loadDocument(mockDocument)
.select('rect1')
.rotate()
.deselectAll()
.undo()
expect(tlstate.selectedIds).toEqual(['rect1'])
tlstate.deselectAll().redo()
expect(tlstate.selectedIds).toEqual(['rect1'])
})
})

View file

@ -50,7 +50,10 @@ export function rotate(data: Data, ids: string[], delta = -PI2 / 4): TLDrawComma
[currentPageId]: { shapes: before },
},
pageStates: {
[currentPageId]: { boundsRotation: beforeBoundsRotation },
[currentPageId]: {
selectedIds: ids,
boundsRotation: beforeBoundsRotation,
},
},
},
},
@ -60,7 +63,10 @@ export function rotate(data: Data, ids: string[], delta = -PI2 / 4): TLDrawComma
[currentPageId]: { shapes: after },
},
pageStates: {
[currentPageId]: { boundsRotation: afterBoundsRotation },
[currentPageId]: {
selectedIds: ids,
boundsRotation: afterBoundsRotation,
},
},
},
},

View file

@ -64,3 +64,20 @@ describe('Stretch command', () => {
expect(tlstate.getShape<RectangleShape>('rect2').size).toStrictEqual([100, 200])
})
})
describe('when running the command', () => {
it('restores selection on undo', () => {
const tlstate = new TLDrawState()
.loadDocument(mockDocument)
.select('rect1', 'rect2')
.stretch(StretchType.Horizontal)
.deselectAll()
.undo()
expect(tlstate.selectedIds).toEqual(['rect1', 'rect2'])
tlstate.deselectAll().redo()
expect(tlstate.selectedIds).toEqual(['rect1', 'rect2'])
})
})

View file

@ -6,6 +6,8 @@ import { TLDR } from '~state/tldr'
export function stretch(data: Data, ids: string[], type: StretchType): TLDrawCommand {
const { currentPageId } = data.appState
const selectedIds = TLDR.getSelectedIds(data, currentPageId)
const initialShapes = ids.map((id) => TLDR.getShape(data, id, currentPageId))
const boundsForShapes = initialShapes.map((shape) => TLDR.getBounds(shape))
@ -63,6 +65,11 @@ export function stretch(data: Data, ids: string[], type: StretchType): TLDrawCom
pages: {
[currentPageId]: { shapes: before },
},
pageStates: {
[currentPageId]: {
selectedIds,
},
},
},
},
after: {
@ -70,6 +77,11 @@ export function stretch(data: Data, ids: string[], type: StretchType): TLDrawCom
pages: {
[currentPageId]: { shapes: after },
},
pageStates: {
[currentPageId]: {
selectedIds,
},
},
},
},
}

View file

@ -4,11 +4,10 @@ import { mockDocument } from '~test'
import { SizeStyle, TLDrawShapeType } from '~types'
describe('Style command', () => {
const tlstate = new TLDrawState()
tlstate.loadDocument(mockDocument)
tlstate.select('rect1')
it('does, undoes and redoes command', () => {
const tlstate = new TLDrawState()
tlstate.loadDocument(mockDocument)
tlstate.select('rect1')
expect(tlstate.getShape('rect1').style.size).toEqual(SizeStyle.Medium)
tlstate.style({ size: SizeStyle.Small })
@ -76,3 +75,20 @@ describe('Style command', () => {
})
})
})
describe('when running the command', () => {
it('restores selection on undo', () => {
const tlstate = new TLDrawState()
.loadDocument(mockDocument)
.select('rect1')
.style({ size: SizeStyle.Small })
.deselectAll()
.undo()
expect(tlstate.selectedIds).toEqual(['rect1'])
tlstate.deselectAll().redo()
expect(tlstate.selectedIds).toEqual(['rect1'])
})
})

View file

@ -60,6 +60,11 @@ export function style(data: Data, ids: string[], changes: Partial<ShapeStyles>):
shapes: beforeShapes,
},
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
appState: {
currentStyle: { ...data.appState.currentStyle },
@ -72,6 +77,11 @@ export function style(data: Data, ids: string[], changes: Partial<ShapeStyles>):
shapes: afterShapes,
},
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
appState: {
currentStyle: { ...data.appState.currentStyle, ...changes },

View file

@ -45,6 +45,11 @@ export function toggleDecoration(
pages: {
[currentPageId]: { shapes: beforeShapes },
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
},
after: {
@ -52,6 +57,11 @@ export function toggleDecoration(
pages: {
[currentPageId]: { shapes: afterShapes },
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
},
}

View file

@ -60,3 +60,20 @@ describe('Toggle command', () => {
expect(tlstate.getShape<RectangleShape>('rect1').isAspectRatioLocked).toBe(false)
})
})
describe('when running the command', () => {
it('restores selection on undo', () => {
const tlstate = new TLDrawState()
.loadDocument(mockDocument)
.select('rect1')
.toggleHidden()
.deselectAll()
.undo()
expect(tlstate.selectedIds).toEqual(['rect1'])
tlstate.deselectAll().redo()
expect(tlstate.selectedIds).toEqual(['rect1'])
})
})

View file

@ -3,7 +3,9 @@ import { TLDR } from '~state/tldr'
export function toggle(data: Data, ids: string[], prop: keyof TLDrawShape): TLDrawCommand {
const { currentPageId } = data.appState
const initialShapes = ids.map((id) => TLDR.getShape(data, id, currentPageId))
const isAllToggled = initialShapes.every((shape) => shape[prop])
const { before, after } = TLDR.mutateShapes(
@ -24,6 +26,11 @@ export function toggle(data: Data, ids: string[], prop: keyof TLDrawShape): TLDr
shapes: before,
},
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
},
after: {
@ -33,6 +40,11 @@ export function toggle(data: Data, ids: string[], prop: keyof TLDrawShape): TLDr
shapes: after,
},
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
},
}

View file

@ -67,14 +67,24 @@ export function translate(data: Data, ids: string[], delta: number[]): TLDrawCom
before: {
document: {
pages: {
[data.appState.currentPageId]: before,
[currentPageId]: before,
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
},
after: {
document: {
pages: {
[data.appState.currentPageId]: after,
[currentPageId]: after,
},
pageStates: {
[currentPageId]: {
selectedIds: ids,
},
},
},
},