Swap primary and foreign tables

src/components/reference_overview.jsx

@@ -132,7 +132,46 @@ export default function ReferenceOverview(props) {
                             bordered
                           />
                           <div className="mt-2">
-                            <Button icon={<IconLoopTextStroked />} block>
+                            <Button
+                              icon={<IconLoopTextStroked />}
+                              block
+                              onClick={() => {
+                                setUndoStack((prev) => [
+                                  ...prev,
+                                  {
+                                    action: Action.EDIT,
+                                    element: ObjectType.RELATIONSHIP,
+                                    rid: i,
+                                    undo: {
+                                      startTableId: r.startTableId,
+                                      startFieldId: r.startFieldId,
+                                      endTableId: r.endTableId,
+                                      endFieldId: r.endFieldId,
+                                    },
+                                    redo: {
+                                      startTableId: r.endTableId,
+                                      startFieldId: r.endFieldId,
+                                      endTableId: r.startTableId,
+                                      endFieldId: r.startFieldId,
+                                    },
+                                  },
+                                ]);
+                                setRedoStack([]);
+                                setRelationships((prev) =>
+                                  prev.map((e, idx) =>
+                                    idx === i
+                                      ? {
+                                          ...e,
+                                          startTableId: e.endTableId,
+                                          startFieldId: e.endFieldId,
+                                          endTableId: e.startTableId,
+                                          endFieldId: e.startFieldId,
+                                        }
+                                      : e
+                                  )
+                                );
+                              }}
+                            >
                               Swap
                             </Button>
                           </div>

src/pages/editor.jsx

@@ -347,10 +347,14 @@ export default function Editor(props) {
                     ...r,
                     startX: updatedValues.x + 15,
                     startY: updatedValues.y + r.startFieldId * 36 + 69,
+                    endX: tables[r.endTableId].x + 15,
+                    endY: tables[r.endTableId].y + r.endFieldId * 36 + 69,
                   };
                 } else if (r.endTableId === id) {
                   return {
                     ...r,
+                    startX: tables[r.startTableId].x + 15,
+                    startY: tables[r.startTableId].y + r.startFieldId * 36 + 69,
                     endX: updatedValues.x + 15,
                     endY: updatedValues.y + r.endFieldId * 36 + 69,
                   };