From 3fbfacc5dabe60083c276ceaee9298ea60384fef Mon Sep 17 00:00:00 2001 From: Guido Genzone <61072167+ggenzone@users.noreply.github.com> Date: Wed, 13 Dec 2023 15:11:52 +0100 Subject: [PATCH] fix(ci): Fix deploy ci * fix(ci): Fix deploy ci --- apps/web/src/components/draw/factory.ts | 8 ++++---- .../web/src/components/draw/hooks/use-canvas-rerender.ts | 4 ++-- .../src/components/draw/lib/selection/selection.test.ts | 9 +++++---- apps/web/src/components/draw/lib/selection/selection.ts | 6 +++--- apps/web/src/components/draw/shapes/line/line.ts | 9 ++++++--- .../components/draw/shapes/rectangle/rectangle.test.ts | 5 +++-- .../src/components/draw/shapes/rectangle/rectangle.ts | 1 + apps/web/src/components/draw/shapes/text/text.test.ts | 5 +++-- apps/web/src/components/draw/shapes/text/text.ts | 2 +- apps/web/src/components/draw/shapes/types/handler.ts | 2 +- apps/web/src/components/draw/store/drawing/on.ts | 6 +++--- apps/web/src/components/draw/store/selection/copy.ts | 4 ++-- apps/web/src/components/draw/store/selection/update.ts | 4 ++-- apps/web/src/components/draw/store/state.ts | 6 +++--- apps/web/src/components/draw/store/storage/load.ts | 6 +++--- packages/schema/src/elements/text/index.ts | 2 -- .../schema/src/elements/text/migrations/v1-to-v2.test.ts | 6 ++---- packages/schema/src/elements/text/parse.test.ts | 4 ---- 18 files changed, 44 insertions(+), 45 deletions(-) diff --git a/apps/web/src/components/draw/factory.ts b/apps/web/src/components/draw/factory.ts index d8e0f75..15946f7 100644 --- a/apps/web/src/components/draw/factory.ts +++ b/apps/web/src/components/draw/factory.ts @@ -1,8 +1,8 @@ +import { type ElementSchemaType } from '@bristles/schema' import { type Point } from './lib/math/types' import { Line } from './shapes/line' import { Rectangle } from './shapes/rectangle' import { Text } from './shapes/text' -import { type Element } from './shapes/types/element' import { type Properties } from './shapes/types/handler' import { type Shapes } from './types' export interface CreateElementProps { @@ -21,7 +21,7 @@ export function createElement (props: CreateElementProps): Element { // throw new Error('Not supported shape') }*/ -function isWithinElement (element: Element, currentPoint: Point) { +function isWithinElement (element: ElementSchemaType, currentPoint: Point) { if (element.name === 'rectangle') { return Rectangle.positionInElement(element, currentPoint).type !== 'outside' } @@ -34,10 +34,10 @@ function isWithinElement (element: Element, currentPoint: Point) { return false } -export function getElementAtPosition (elements: Element[], currentPoint: Point) { +export function getElementAtPosition (elements: ElementSchemaType[], currentPoint: Point) { return elements.find((elem) => isWithinElement(elem, currentPoint)) } -export function getIndexElementAtPosition (elements: Element[], currentPoint: Point) { +export function getIndexElementAtPosition (elements: ElementSchemaType[], currentPoint: Point) { return elements.findIndex((elem) => isWithinElement(elem, currentPoint)) } diff --git a/apps/web/src/components/draw/hooks/use-canvas-rerender.ts b/apps/web/src/components/draw/hooks/use-canvas-rerender.ts index 0d8e1fe..3b51238 100644 --- a/apps/web/src/components/draw/hooks/use-canvas-rerender.ts +++ b/apps/web/src/components/draw/hooks/use-canvas-rerender.ts @@ -1,10 +1,10 @@ import { useEffect, useLayoutEffect, useReducer, useRef } from 'react' import { ShapeHandler } from '../shapes' -import { type Element } from '../shapes/types/element' import { type Point } from '../lib/math/types' import { viewportReducer } from '../store/viewport/reducer' import { type ViewportState, initState } from '../store/viewport/state' +import { type ElementSchemaType } from '@bristles/schema' interface SelectionState { type: 'simple' | 'multiple' @@ -15,7 +15,7 @@ interface SelectionState { } interface UseCanvasRerenderProps { - elements: Element[] + elements: ElementSchemaType[] selection?: SelectionState } diff --git a/apps/web/src/components/draw/lib/selection/selection.test.ts b/apps/web/src/components/draw/lib/selection/selection.test.ts index 36d0c3b..03b83d1 100644 --- a/apps/web/src/components/draw/lib/selection/selection.test.ts +++ b/apps/web/src/components/draw/lib/selection/selection.test.ts @@ -1,12 +1,13 @@ -import { type Element } from '../../shapes/types/element' + +import { ElementSchemaType } from '@bristles/schema' import { selectElement } from './selection' import { type SelectionState } from './types' import { describe, test, expect } from 'vitest' -const elements: Element[] = [ +const elements: ElementSchemaType[] = [ // Example elements data (replace with actual data or mock data as needed) - { id: '1', name: 'rectangle', width: 50, height: 30, x: 10, y: 10, color: '#fff', selected: false, angle: 0, opacity: 1, fill: { style: 'Solid' }, stroke: { style: 'Dashed', width: 1 } }, - { id: '2', name: 'text', width: 70, height: 20, x: 10, y: 10, selected: false, angle: 0, text: 'Hello World', opacity: 1, color: 'red', font: { family: 'sans-serif', size: 12, align: 'center' } } + { version: 2, id: '1', name: 'rectangle', width: 50, height: 30, x: 10, y: 10, color: '#fff', selected: false, angle: 0, opacity: 1, fill: { style: 'Solid' }, stroke: { style: 'Dashed', width: 1 } }, + { version: 2, id: '2', name: 'text', width: 70, height: 20, x: 10, y: 10, selected: false, angle: 0, text: 'Hello World', opacity: 1, color: 'red', font: { family: 'sans-serif', size: 12, align: 'center' }} // Add more elements as necessary for testing different scenarios ] diff --git a/apps/web/src/components/draw/lib/selection/selection.ts b/apps/web/src/components/draw/lib/selection/selection.ts index ca04f24..f8e9fd5 100644 --- a/apps/web/src/components/draw/lib/selection/selection.ts +++ b/apps/web/src/components/draw/lib/selection/selection.ts @@ -1,15 +1,15 @@ import { type SelectionState } from './types' -import { type Element } from '../../shapes/types/element' import { ShapeHandler } from '../../shapes' +import { type ElementSchemaType } from '@bristles/schema' /** * Update selection structure - * @param {Element[]} elements - List of existing elements. + * @param {ElementSchemaType[]} elements - List of existing elements. * @param {string} elementId - Element to be selected. * @param {SelectionState | undefined} selection - Current selection state. * @returns {SelectionState | undefined} - Returns the new selection state, otherwise undefined. */ -export const selectElement = (elements: Element[], elementId: string, selection: SelectionState | undefined): SelectionState | undefined => { +export const selectElement = (elements: ElementSchemaType[], elementId: string, selection: SelectionState | undefined): SelectionState | undefined => { const currentElement = elements.find(el => el.id === elementId) if (currentElement === undefined) { diff --git a/apps/web/src/components/draw/shapes/line/line.ts b/apps/web/src/components/draw/shapes/line/line.ts index f05a916..96495e3 100644 --- a/apps/web/src/components/draw/shapes/line/line.ts +++ b/apps/web/src/components/draw/shapes/line/line.ts @@ -25,6 +25,7 @@ export function draw (element: LineSchemaType, props: DrawFunctionProps) { /** * Draw arrow head */ + /* if (element.arrow.style === 'head') { const headlen = 15 const angle = Math.atan2(toPoint.y - fromPoint.y, toPoint.x - fromPoint.x) @@ -47,6 +48,7 @@ export function draw (element: LineSchemaType, props: DrawFunctionProps) { context.closePath() context.stroke() } + */ //rc.linearPath([[690, 10], [790, 20], [750, 120], [690, 100]]) @@ -88,6 +90,7 @@ export function draw (element: LineSchemaType, props: DrawFunctionProps) { export function create (action: ElementDrawingAction): LineSchemaType { const { currentPoint, properties } = action const line: LineSchemaType = { + version: 2, id: crypto.randomUUID(), name: 'line', x: currentPoint.x, @@ -98,7 +101,7 @@ export function create (action: ElementDrawingAction): LineSchemaType { color: properties.color, opacity: properties.opacity, stroke: properties.stroke ?? { style: 'Dashed', width: 5 }, - arrow: properties.arrow ?? { style: 'arrow' }, + // arrow: properties.arrow ?? { style: 'arrow' }, // points: [{ x: 0, y: 0 }, { x: 0, y: 0 }], selected: false @@ -294,7 +297,7 @@ export function update (element: LineSchemaType, properties: Properties): LineSc color: properties.color, opacity: properties.opacity, stroke: properties.stroke ?? element.stroke, - arrow: properties.stroke ?? element.arrow + //arrow: properties.stroke ?? element.arrow } } @@ -303,5 +306,5 @@ export function allowedProperties (): string[] { } export function properties (element: LineSchemaType): Properties { - return { color: element.color, opacity: element.opacity, arrow: element.arrow, stroke: element.stroke } + return { color: element.color, opacity: element.opacity, /*arrow: element.arrow,*/ stroke: element.stroke } } diff --git a/apps/web/src/components/draw/shapes/rectangle/rectangle.test.ts b/apps/web/src/components/draw/shapes/rectangle/rectangle.test.ts index 2caedad..349cbd0 100644 --- a/apps/web/src/components/draw/shapes/rectangle/rectangle.test.ts +++ b/apps/web/src/components/draw/shapes/rectangle/rectangle.test.ts @@ -1,7 +1,7 @@ import { describe, test, expect, vi } from 'vitest' import { type ElementMainAction } from '../types/actions' -import { type RectangleElement } from './types' import { create, endAction, positionInElement, startAction, updateAction } from './rectangle' +import { RectangleSchemaType } from '@bristles/schema' const fixedUUID = '550e8400-e29b-41d4-a716-446655440000' // Mock the crypto.randomUUID function @@ -67,7 +67,8 @@ describe('Draw a rectangle', () => { }) describe('positionInElement', () => { - const rectangle: RectangleElement = { + const rectangle: RectangleSchemaType = { + version: 2, id: '', name: 'rectangle', x: 10, diff --git a/apps/web/src/components/draw/shapes/rectangle/rectangle.ts b/apps/web/src/components/draw/shapes/rectangle/rectangle.ts index cdcdad2..34ef0e3 100644 --- a/apps/web/src/components/draw/shapes/rectangle/rectangle.ts +++ b/apps/web/src/components/draw/shapes/rectangle/rectangle.ts @@ -88,6 +88,7 @@ function moveRectangle (oldElement: RectangleSchemaType, currentPoint: Point, of export function create (props: ElementDrawingAction): RectangleSchemaType { const { properties, currentPoint } = props const rectangle: RectangleSchemaType = { + version: 2, id: crypto.randomUUID(), name: 'rectangle', x: currentPoint.x, diff --git a/apps/web/src/components/draw/shapes/text/text.test.ts b/apps/web/src/components/draw/shapes/text/text.test.ts index e52261e..13f979e 100644 --- a/apps/web/src/components/draw/shapes/text/text.test.ts +++ b/apps/web/src/components/draw/shapes/text/text.test.ts @@ -1,6 +1,6 @@ import { describe, test, expect, vi } from 'vitest' -import { type TextElement } from './types' import { positionInElement } from './text' +import { TextSchemaType } from '@bristles/schema' const fixedUUID = '550e8400-e29b-41d4-a716-446655440000' // Mock the crypto.randomUUID function @@ -11,7 +11,8 @@ const crypto = { vi.stubGlobal('crypto', crypto) describe('positionInElement', () => { - const text: TextElement = { + const text: TextSchemaType = { + version: 2, id: fixedUUID, name: 'text', x: 0, diff --git a/apps/web/src/components/draw/shapes/text/text.ts b/apps/web/src/components/draw/shapes/text/text.ts index b95f5fe..f08d789 100644 --- a/apps/web/src/components/draw/shapes/text/text.ts +++ b/apps/web/src/components/draw/shapes/text/text.ts @@ -59,8 +59,8 @@ export function create (action: ElementDrawingAction): TextSchemaType { context.font = '32px sans-serif' const width = context.measureText(userText).width - console.log(width) const text: TextSchemaType = { + version: 2, id: crypto.randomUUID(), name: 'text', x: currentPoint.x, diff --git a/apps/web/src/components/draw/shapes/types/handler.ts b/apps/web/src/components/draw/shapes/types/handler.ts index cd0a414..d68e3ca 100644 --- a/apps/web/src/components/draw/shapes/types/handler.ts +++ b/apps/web/src/components/draw/shapes/types/handler.ts @@ -1,4 +1,4 @@ -import type { ElementSchemaType, FillPropertiesType, FontPropertiesType, StrokePropertiesType } from '@bristles/schema' +import type { FillPropertiesType, FontPropertiesType, StrokePropertiesType } from '@bristles/schema' import { type Point } from '../../lib/math/types' import { type ElementDrawingAction, type ElementMainAction } from './actions' diff --git a/apps/web/src/components/draw/store/drawing/on.ts b/apps/web/src/components/draw/store/drawing/on.ts index b8dd663..0b939c7 100644 --- a/apps/web/src/components/draw/store/drawing/on.ts +++ b/apps/web/src/components/draw/store/drawing/on.ts @@ -1,8 +1,8 @@ +import { ElementSchemaType } from '@bristles/schema' import { getObjects, updateElements } from '../../lib/history/history' import { type Point } from '../../lib/math/types' import { ShapeHandler } from '../../shapes' import { requestElementDrawing } from '../../shapes/types/actions' -import { type Element } from '../../shapes/types/element' import { type DrawingState } from '../type' export const DRAWING_ON_ACTION = 'ON_DRAWING' @@ -21,8 +21,8 @@ export interface OnDrawingAction { * @returns {DrawingState} - The updated state after applying the action. */ export function drawingOnReducer (state: DrawingState, action: OnDrawingAction): DrawingState { - const objects = getObjects(state.elements) - const setElements = updateElements(state.elements) + const objects = getObjects(state.elements) + const setElements = updateElements(state.elements) if (state.action.name === 'drawing' && state.action.elementId !== undefined) { const elementId = state.action.elementId const currentElement = objects.find(el => el.id === elementId) diff --git a/apps/web/src/components/draw/store/selection/copy.ts b/apps/web/src/components/draw/store/selection/copy.ts index b8f595b..074f1a2 100644 --- a/apps/web/src/components/draw/store/selection/copy.ts +++ b/apps/web/src/components/draw/store/selection/copy.ts @@ -1,8 +1,8 @@ import { getObjects, updateElements } from '../../lib/history/history' -import { type Element } from '../../shapes/types/element' import { type DrawingState } from '../type' import { ShapeHandler } from '../../shapes' import { type Point } from '../../lib/math/types' +import { type ElementSchemaType } from '@bristles/schema' export const SELECTION_COPY_ACTION = 'SELECTION_COPY' @@ -25,7 +25,7 @@ export function selectionCopyReducer (state: DrawingState, action: SelectionCopy } const elements = getObjects(state.elements) - const newElements: Element[] = [] + const newElements: ElementSchemaType[] = [] elements.forEach(element => { if (state.selection !== undefined && state.selection.ids.includes(element.id)) { const origin = action.payload.point ?? { x: element.x + 10, y: element.y + 10 } diff --git a/apps/web/src/components/draw/store/selection/update.ts b/apps/web/src/components/draw/store/selection/update.ts index 0f2ba7d..22adfdd 100644 --- a/apps/web/src/components/draw/store/selection/update.ts +++ b/apps/web/src/components/draw/store/selection/update.ts @@ -1,8 +1,8 @@ import { updateElements } from '../../lib/history/history' import { type Properties } from '../../shapes/types/handler' -import { type Element } from '../../shapes/types/element' import { type DrawingState } from '../type' import { ShapeHandler } from '../../shapes' +import { type ElementSchemaType } from '@bristles/schema' export const SELECTION_UPDATE_ACTION = 'SELECTION_UPDATE' @@ -24,7 +24,7 @@ export function selectionUpdateReducer (state: DrawingState, action: SelectionUp return { ...state } } - const applyUpdate = (element: Element): Element => { + const applyUpdate = (element: ElementSchemaType): ElementSchemaType => { if (state.selection !== undefined && state.selection.ids.includes(element.id)) { // @ts-expect-error find out how to call generic method based on element return ShapeHandler(element.name).update(element, action.payload.properties) diff --git a/apps/web/src/components/draw/store/state.ts b/apps/web/src/components/draw/store/state.ts index b056ba6..048e183 100644 --- a/apps/web/src/components/draw/store/state.ts +++ b/apps/web/src/components/draw/store/state.ts @@ -1,4 +1,3 @@ -import { type Element } from '../shapes/types/element' import { getObjects } from '../lib/history/history' import type { DrawingState } from './type' import type { ObjectWithHistory } from '../lib/history/types' @@ -29,8 +28,9 @@ import { SELECTION_UPDATE_ACTION, selectionUpdateReducer } from './selection/upd import { SELECTION_COPY_ACTION, selectionCopyReducer } from './selection/copy' import { type Properties } from '../shapes/types/handler' import { DispatchStateAction } from './store.actions' +import { ElementSchemaType } from '@bristles/schema' -export const initElementsWithHistory: ObjectWithHistory = { +export const initElementsWithHistory: ObjectWithHistory = { history: [[]], index: 0 } @@ -208,7 +208,7 @@ export function stateReducer (state: DrawingState, action: DispatchStateAction): throw Error('Unknown action') } -export function getElements (state: DrawingState): Element[] { +export function getElements (state: DrawingState): ElementSchemaType[] { return getObjects(state.elements) } diff --git a/apps/web/src/components/draw/store/storage/load.ts b/apps/web/src/components/draw/store/storage/load.ts index 968d859..114eb91 100644 --- a/apps/web/src/components/draw/store/storage/load.ts +++ b/apps/web/src/components/draw/store/storage/load.ts @@ -1,13 +1,13 @@ import { updateElements } from '../../lib/history/history' import { type DrawingState } from '../type' -import { type Element } from '../../shapes/types/element' +import { type ElementSchemaType } from '@bristles/schema' export const STORAGE_LOAD_ACTION = 'STORAGE_LOAD' export interface StorageLoadAction { type: 'STORAGE_LOAD' payload: { - elements: Element[] + elements: ElementSchemaType[] } } @@ -25,6 +25,6 @@ export function storageLoadReducer (state: DrawingState, action: StorageLoadActi } } -export function createStorageLoadAction (elements: Element[]): StorageLoadAction { +export function createStorageLoadAction (elements: ElementSchemaType[]): StorageLoadAction { return { type: STORAGE_LOAD_ACTION, payload: { elements } } } diff --git a/packages/schema/src/elements/text/index.ts b/packages/schema/src/elements/text/index.ts index 890cd4f..18cb981 100644 --- a/packages/schema/src/elements/text/index.ts +++ b/packages/schema/src/elements/text/index.ts @@ -1,5 +1,4 @@ import { z } from 'zod' -import { StrokePropertiesSchema } from '../../properties/stroke' import { FontPropertiesSchema } from '../..' export const TextSchema = z.object({ @@ -13,7 +12,6 @@ export const TextSchema = z.object({ angle: z.number(), opacity: z.number(), color: z.string(), - stroke: StrokePropertiesSchema, font: FontPropertiesSchema, text: z.string(), selected: z.boolean() diff --git a/packages/schema/src/elements/text/migrations/v1-to-v2.test.ts b/packages/schema/src/elements/text/migrations/v1-to-v2.test.ts index 2a77618..8f2a4c2 100644 --- a/packages/schema/src/elements/text/migrations/v1-to-v2.test.ts +++ b/packages/schema/src/elements/text/migrations/v1-to-v2.test.ts @@ -13,8 +13,7 @@ describe('Line migration from v1 to v2', () => { width: 100, height: 100, angle: 0, - opacity: 1, - stroke: { style: 'Dotted', width: 1 } + opacity: 1 } const expectedMigratedLine = { @@ -28,8 +27,7 @@ describe('Line migration from v1 to v2', () => { height: 100, angle: 0, opacity: 1, - selected: false, - stroke: { style: 'Dotted', width: 1 } + selected: false } const migratedRectangle = applyV1toV2Migration(lineV1) diff --git a/packages/schema/src/elements/text/parse.test.ts b/packages/schema/src/elements/text/parse.test.ts index 7430b6a..51159a4 100644 --- a/packages/schema/src/elements/text/parse.test.ts +++ b/packages/schema/src/elements/text/parse.test.ts @@ -16,7 +16,6 @@ describe('parseLine function', () => { angle: 45, opacity: 0.8, selected: true, - stroke: { style: 'Dashed', width: 2 }, font: { size: 32, family: 'sans-serif', align: 'center' }, text: 'Hello world' } @@ -38,7 +37,6 @@ describe('parseLine function', () => { height: 100, angle: 0, opacity: 1, - stroke: { style: 'Dotted', width: 1 }, font: { size: 32, family: 'sans-serif', align: 'center' }, text: 'Hello world' } @@ -55,7 +53,6 @@ describe('parseLine function', () => { angle: 0, opacity: 1, selected: false, - stroke: { style: 'Dotted', width: 1 }, font: { size: 32, family: 'sans-serif', align: 'center' }, text: 'Hello world' } @@ -72,7 +69,6 @@ describe('parseLine function', () => { version: 2, color: 'green', // Missing 'id' property fill: { style: 'Solid' }, - stroke: { style: 'Solid', width: 1 }, font: { size: 32, family: 'sans-serif', align: 'center' } }