Add support for connectors

Change-Id: Ib57f539de348596d1d70d1154420ab1f11458794

diff --git a/src/app/importActions.ts b/src/app/importActions.ts
index 4dbae09bb1daf81375d4ab9c5336e5a547808ffa..27d9bec75a1467c614f29684a4397249dd3d9418 100644 (file)
--- a/src/app/importActions.ts
+++ b/src/app/importActions.ts
@@ -1,6 +1,6 @@
 'use server';
 
-import { AppCardItem, CardItem, DocumentItem, EmbedItem, FrameItem, ImageItem, Item, ShapeItem, StickyNoteItem, TextItem } from '@mirohq/miro-api';
+import { AppCardItem, CardItem, Connector, DocumentItem, EmbedItem, FrameItem, ImageItem, Item, ShapeItem, StickyNoteItem, TextItem } from '@mirohq/miro-api';
 import initMiroAPI from '../utils/initMiroAPI';
 import { Path, Shape, Slide, Whiteboard, Image, neoboardWhiteboardWidth, neoboardWhiteboardHeight } from './neoboardTypes';
 import { stripHtml } from 'string-strip-html';
@@ -65,6 +65,7 @@ export async function importBoard(prevState: FormState, formData: FormData): Pro
         const frames: {
             frame: FrameItem;
             children: (Item | AppCardItem | CardItem | DocumentItem | EmbedItem | ImageItem | ShapeItem | StickyNoteItem | TextItem)[];
+            connectors: Connector[];
         }[] = [];
 
         for await (const frame of framesGenerator) {
@@ -86,8 +87,21 @@ export async function importBoard(prevState: FormState, formData: FormData): Pro
                 }
             }
 
+            const connectors: Connector[] = [];
+            const connectorsRaw = board.getAllConnectors();
+            for await (const connector of connectorsRaw) {
+                // Check if the connector has start and end item IDs matching any of the items in the frame
+                if (connector.startItem && connector.endItem) {
+                    if (children.some(c => c.id === connector.startItem?.id) && children.some(c => c.id === connector.endItem?.id)) {
+                        connectors.push(connector);
+                    }
+                }
+            }
+
             frames.push({
-                frame: frame as FrameItem, children
+                frame: frame as FrameItem,
+                children,
+                connectors
             });
         }
 
@@ -131,6 +145,37 @@ export async function importBoard(prevState: FormState, formData: FormData): Pro
                 }
             }
 
+            for (const connector of frameData.connectors) {
+                const startItem = frameData.children.find(c => c.id === connector.startItem?.id);
+                const endItem = frameData.children.find(c => c.id === connector.endItem?.id);
+                if (startItem && endItem) {
+                    const path: Path = {
+                        type: 'path',
+                        kind: 'line',
+                        position: {
+                            x: startItem.position?.x ?? 0,
+                            y: startItem.position?.y ?? 0,
+                        },
+                        // Relative to the position given above
+                        points: [
+                            // Start point
+                            {
+                                x: 0,
+                                y: 0,
+                            },
+                            // End point
+                            {
+                                x: endItem.position?.x ? endItem.position.x - (startItem.position?.x ?? 0) : 0,
+                                y: endItem.position?.y ? endItem.position.y - (startItem.position?.y ?? 0) : 0,
+                            },
+                        ],
+                        strokeColor: connector.style?.color ?? '#1a1a1a',
+                        endMarker: connector.style?.endStrokeCap === 'arrow' ? 'arrow-head-line' : undefined
+                    };
+                    slide.elements.push(path);
+                }
+            }
+
             neoboard.whiteboard.slides.push(slide);
         }